downshift-js/downshift

Default / Initial value for downshift

Open

#665 geöffnet am 11. Feb. 2019

Auf GitHub ansehen
 (12 Kommentare) (1 Reaktion) (0 zugewiesene Personen)JavaScript (980 Forks)batch import
docshelp wanted

Repository-Metriken

Stars
 (11.761 Stars)
PR-Merge-Metriken
 (Durchschn. Merge 6T 9h) (5 gemergte PRs in 30 T)

Beschreibung

I'm using downshift 3.0.0

How to set the initial default value ?

My code:

            <Downshift
                itemToString={item => (item ? item.value : '')}
                onSelect={this.props.onChange}
            >
                {({
                      getInputProps,
                      getItemProps,
                      getMenuProps,
                      isOpen,
                      inputValue,
                      highlightedIndex,
                      selectedItem
                  }) => (
                    <div className="max-width-252">
                        <CustomInput getInputProps={getInputProps} labelText={labelText}/>
                        <div>
                            {isOpen
                                ? items
                                    .filter(item => !inputValue || item.value.includes(inputValue))
                                    .map((item, index) => (
                                        <option
                                            {...getItemProps({
                                                key: item.value,
                                                index,
                                                item,
                                                style: {
                                                    backgroundColor:
                                                        highlightedIndex === index ? 'lightgray' : 'white',
                                                    fontWeight: selectedItem === item ? 'bold' : 'normal',
                                                },
                                            })}
                                        >
                                            {item.value}
                                        </option>
                                    ))
                                : null}
                        </div>
                    </div>
                )}
            </Downshift>

Contributor Guide