Estoy usando reaccionar seleccionar para representar un componente de selección:
const options = [...] <Select ... options={options} /> El problema es que cualquier valor que escriba que no esté dentro de options no se seleccionará (cuando el componente de selección no esté enfocado, el valor desaparecerá).
¿Hay alguna manera de hacer que <Select/> sea más un componente de sugerencias que proporcione options de autocompletado pero que también permita ingresar cualquier valor?
Puede usar el Componente creatable para lograr eso:
Ejemplo de reaccionar-seleccionar
import React, { Component } from 'react'; import CreatableSelect from 'react-select/creatable'; import { colourOptions } from '../data'; export default class CreatableSingle extends Component<*, State> { handleChange = (newValue: any, actionMeta: any) => { console.group('Value Changed'); console.log(newValue); console.log(`action: ${actionMeta.action}`); console.groupEnd(); }; handleInputChange = (inputValue: any, actionMeta: any) => { console.group('Input Changed'); console.log(inputValue); console.log(`action: ${actionMeta.action}`); console.groupEnd(); }; render() { return ( <CreatableSelect isClearable onChange={this.handleChange} onInputChange={this.handleInputChange} options={colourOptions} /> ); } }