Vous voulez obtenir la valeur du champ de texte dans React-js qui a un menu déroulant dynamique

Question

J'utilise un champ de saisie semi-automatique dans mon projet react-js. Le code du champ est donné ci-dessous.

<Autocomplete 
    id="Autocomplete" 
    placeholder="I want ..." 
    className="md-cell md-cell--4" 
    data={services} 
    filter={Autocomplete.caseInsensitiveFilter} 
    inputStyle={style.inputstyle} 
    style={style.rootstyle} 
    listStyle={style.liststyle} 
    onChange={this.handleChange.bind(this.value)} 
/> 

Il est un champ de saisie semi-automatique quelque chose comme ça

Maintenant, ce que je veux est d'obtenir la valeur une fois que l'utilisateur de sélectionner son choix. En utilisant onChange, j'obtiens seulement la valeur entrée par l'utilisateur ou j'obtiens la valeur complète après que l'utilisateur ait pressé l'espace après avoir choisi le choix.

Ce que je veux, c'est obtenir la valeur du champ dès que l'utilisateur sélectionne son choix.

Merci d'avance!

Answer 1

Comme suggéré dans doc, vous devez utiliser onAutocomplete pour obtenir la valeur autocompleted. Je pense que vous supposez que onChange ferait cela pour vous. Remplacez plutôt onChange par onAutocomplete.

<Autocomplete 
id="Autocomplete" 
placeholder="I want ..." 
className="md-cell md-cell--4" 
data={services} 
filter={Autocomplete.caseInsensitiveFilter} 
inputStyle={style.inputstyle} 
style={style.rootstyle} 
listStyle={style.liststyle} 
onAutocomplete={this.handleChange.bind(this.value)} 
/> 

Doc ici: https://react-md.mlaursen.com/components/autocompletes?tab=1#autocomplete-proptypes-on-autocomplete