Reactive Native Texteingabe Löschen löscht Text nicht

Question

Edit: Bei weiterer Überprüfung scheint es, dass dies nur in Android 6.0.1 passiert. Nachdem auf mehreren Geräten mit 6.0 versucht wurde, war dies kein Problem.

Ich habe eine sehr einfache React Native Code-Snippet, wo ich Text in einem TextInput löschen möchte. Es sieht ein bisschen wie folgt aus:

state = { 
    v: "" 
}; 

_changeText = v => { 
    this.setState({ v }); 
}; 

clear =() => { 
    this.textInputRef.clear(); 
} 

render() { 
    return (
    <View style={styles.container}> 
     <TouchableOpacity onPress={this.clear}> 
     <Text> Clear </Text> 
     </TouchableOpacity> 
     <TextInput 
     ref={ref => this.textInputRef = ref} 
     value={this.state.v} 
     onChangeText={this._changeText} 
     /> 

    </View> 
); 
} 

nun das Verhalten, das ich erwarten würde, ist für diese die Texteingabe im Fokus zu verlassen, und den Text löschen. Dies ist der Fall - in dem Moment, in dem ich anfange, etwas auf der Tastatur zu tippen, erscheint der Text, den ich zuvor gelöscht habe, wieder in der Texteingabe. Offensichtlich ist diese Art von Persistenz des Textes nicht wirklich erwünscht.

Sind Sie jemals auf dieses Problem gestoßen? Ist es ein RN-Fehler oder gibt es eine Möglichkeit, dieses Verhalten zu vermeiden, ohne die Tastatur zu verwischen?

Hier ist ein kleiner Ausschnitt um zu verdeutlichen, was ich meine: https://snack.expo.io/H1S9b5Mpe.

Wenn Sie mit der Eingabe beginnen, drücken Sie die Taste clear, und fahren Sie fort mit der Eingabe. Der zuvor angezeigte Text wird vor dem neu eingegebenen Text angezeigt.

Answer 1

Es ist möglich, dass es sich auf eine bestimmte RN-Version bezieht, oder wie Sie herausgefunden haben - auf eine bestimmte Betriebssystemversion. Das Snippet, das Sie in der Tat gut funktioniert haben, kann dieses Problem bei 6.0.0 nicht reproduzieren.

Vielleicht anstelle der Verwendung der clear Methode von TextInput können Sie eine andere Art und Weise versuchen, den Text wie so klar: this.setState({v: ""});. Dadurch wird sichergestellt, dass der Status synchron ist und nicht den vorherigen Wert enthält.

Answer 2

Ich habe gerade damit fertig gekämpft! Es ist ein starker Schmerz!

Was ich tat dies zu lösen (bis jetzt), die autocorrect Stütze der TextInput- auf false gesetzt wurde, scheint es, wie dies die Tastatur verhindert,

<TextInput 
    autoCorrect={false} 
    ref={component => this.messageInput = component} 
    value={this.state.message} 
    onChangeText={(text) => this.setState({ message: text })} 
    placeholder="Type your message here..." /> 

„einen Zustand zu halten“ habe ich versucht, alles andere und es scheint, als ob das funktioniert hat. Ich freue mich auf eine bessere Lösung!

BTW: Sie sollten auch this.setState({ message: "" }) tun, so dass der Wert für die Eingabe auf eine leere Zeichenfolge zurückgesetzt wird.