downshift-js/downshift

Default / Initial value for downshift

Aberta

#665 aberto em 11 de fev. de 2019

 (12 comentários) (1 reação) (0 responsável)JavaScript (980 forks)batch import
docshelp wanted

Métricas do repositório

Stars
 (11.761 estrelas)
Métricas de merge de PR
 (Métricas PR pendentes)

Description

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>

Guia do colaborador