Wie lösche ich den Text in einem auto-complete-Feld?

Question

Ich habe ein Feld, das die automatische Vervollständigung

 searchText = {this.state.searchText} 

wie diese verwendet;

 <AutoComplete 
     floatingLabelText='agent input' 
     ref='agentInput' 
     hintText="type response" 
     multiLine = {true} 
     fullWidth = {true} 
     searchText = {this.state.searchText} 
     onNewRequest={this.sendAgentInput} 
     dataSource={this.agentCommands} 
     /> 

aber wenn ich ein Update der this.setState({searchText: null }) es wird die Autocomplete einmal klar, aber nicht das zweite Mal.

Nicht sicher, ob dies ein Fehler ist oder ob es eine andere Möglichkeit gibt, das Feld zurückzusetzen.

Ich versuchte auch für den Bereich der Suche und ein ref aber kein Glück hinzufügen.

hier bei abgelegt ist es ein Fehler https://github.com/callemall/material-ui/issues/2615

Answer 1

Versuchen auch search auf jedem Input-Update zu ändern:

onUpdateInput={this.handleUpdateInput} 

Diese Funktion search ändern soll, wenn Benutzer die Eingabe ändert:

handleUpdateInput(text) { 
    this.setState({ 
    searchText: text 
    }) 
} 

Meine Code sieht wie folgt aus (ES6):

class MyComponent extends Component { 
    constructor (props) { 
    super(props) 

    this.dataSource = ['a', 'b' ,'c'] 
    this.state = { 
     searchText: '' 
    } 

    } 

    handleUpdateInput (t) { this.setState({ searchText: t }) } 

    handleSelect (t) { this.setState({ searchText: '' }) } 

    render() { 
    return <AutoComplete dataSource={this.dataSource} 
         searchText={this.state.searchText} 
         onNewRequest={this.handleSelect.bind(this)} 
         onUpdateInput={this.handleUpdateInput.bind(this)} 
    /> 
    }  
} 

Hier möchte ich Eingabe löschen, wenn der Benutzer die Eingabetaste drückt oder wählt einen Gegenstand aus der Liste (so lösche ich search in handleSelect), aber ich auch Zustand ändern searchText bei jeder Eingabeaktualisierung (handleUpdateInput).

Ich hoffe, es wird für Sie arbeiten!

Answer 2

Try this:

this.setState({ searchText: "\r" }); 

, weil ich die Funktion denken, sollte die Länge der Zeichenfolge testen (BUG?)