Skip to content

Commit

Permalink
Fix TextInput dropping text when used as uncontrolled component with …
Browse files Browse the repository at this point in the history
…`defaultValue`

Summary:
A layout-impacting style change will trigger a layout effect hook within `TextInput`. This hook fires a ViewManager command to set the text input based on the known JS value: https://github.com/facebook/react-native/blob/d82cd3cbce1597512bb2868fde49b5b3850892a0/Libraries/Components/TextInput/TextInput.js#L1009

The JS value is determined using `value` if set, falling back to `defaultValue`. If a component uses `TextInput` as an uncontrolled component, and does not set this value, the command wipes text input back to the default value. This does not happen on re-render of the JS side, despite setting text prop, since the underlying native property never changes/triggers a rerender.

This change alters the logic to prefer `lastNativeText` instead of `defaultValue` when available, to retain the updated `TextInput` content on relayout.

Reviewed By: javache

Differential Revision: D37801394

fbshipit-source-id: d56c719d56bebac64553c731ce9fca8efc7feae9
  • Loading branch information
NickGerleman authored and facebook-github-bot committed Jul 13, 2022
1 parent f0c4c29 commit 51f49ca
Showing 1 changed file with 2 additions and 0 deletions.
2 changes: 2 additions & 0 deletions Libraries/Components/TextInput/TextInput.js
Original file line number Diff line number Diff line change
Expand Up @@ -976,6 +976,8 @@ function InternalTextInput(props: Props): React.Node {
const text =
typeof props.value === 'string'
? props.value
: typeof lastNativeText === 'string'
? lastNativeText
: typeof props.defaultValue === 'string'
? props.defaultValue
: '';
Expand Down

0 comments on commit 51f49ca

Please sign in to comment.