react / react/react-native

Setting the value of a controlled TextInput breaks when autocorrect suggestion present

Offen
#27,019 21 Kommentare 6 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Bug Component: TextInput Issue: Author Provided Repro Platform: iOS
Vorherrschende Sprache
C++
Sterne
127k
Forks
25.3k
Ø Merge
1 T. 23 Std.
Gemergte PRs (30 T.)
4

Beschreibung

On iOS, something wonky happens when the value of a TextInput is programmatically modified (via setState and the value property of said TextInput) and an autocorrect suggestion is present.

The value of the text input ends up being set to the combination of the autocorrect suggestion and the programmatic value. This only happens when multiline={true}. When multiline={false}, all is fine.

This seems only to be reproducible on iOS. I was not able to reproduce on the Snack iOS simulator. This can be reproduced using the software keyboard in the Snack iOS simulator with multiline={true}. The Snack iOS simulator does not reproduce with multiline={false}, but this does reproduce on a device.

React Native version: 0.59-0.76

Steps To Reproduce

  1. Start the reproducer: https://snack.expo.dev/@mhoran/trusting-peanut
  2. Type "Yo mh" and wait for the auto-correct suggestion of "my"
  3. Click "Bananas!"
  4. Notice that the value set programmatically will become a combination of the autocorrect value and the programmatic value.

Describe what you expected to happen:

I expected the value to be set to "Yo mhoran".

Snack, code example, screenshot, or link to a repository:

https://snack.expo.dev/@mhoran/trusting-peanut

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
  3. Forke das Repository und arbeite in einem Branch.
  4. Öffne einen Pull Request, der die Issue-Nummer nennt.

Rechercherichtung

Beginne mit dem verlinkten Snack-Reproduzierer und dem React Native TextInput-Verhalten im Zusammenhang mit setState, der value-Eigenschaft, mehrzeiliger Eingabe und der iOS-Autokorrektur. Reproduziere das Problem auf einem iOS-Gerät und vergleiche den resultierenden Wert mit dem erwarteten "Yo mhoran"; abgeschlossen ist die Aufgabe, wenn programmatische Aktualisierungen nicht mehr mit dem ausstehenden Autokorrekturvorschlag kombiniert werden.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
ios, react-native
Bereich
mobile-dev
Issue-Typ
Bug
Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.