TextInput ref gets re-set with every render
See original GitHub issueDescription
starting in 0.62 (probably related with the hooks-rewrite of textinput), every time textinput re-renders, the ref
callback function is executed. That means that for every character you write, ref
callback is called with
null
and then- new ref
the refs are not referentially equal, even though the _nativeTag
field on the ref is the same, and the TextInput is not unmounted in between the renders.
React Native version:
This is reproducible on current master
Steps To Reproduce
Provide a detailed list of steps that reproduce the issue.
use code here https://github.com/facebook/react-native/blob/5cde6c5e7d440e62d21ef858d77ed185df8a2da0/RNTester/js/examples/TextInput/TextInputSharedExamples.js#L162 - just put a console log in there
Expected Results
I expect the ref callback to be called when the component mounts / unmounts only, not on every re-render
Issue Analytics
- State:
- Created 3 years ago
- Reactions:6
- Comments:7
@vonovak The code you provided to reproduce the error actually is expected to cause the callback to be run on every re-render (see callback ref caveats).
But still, I came across the same error even when the callback ref is not re-created on every render. You can look at the result here.
The ref callback is only called on every re-render (4 times) when the code is running on mobile (I have only tested iOS). There is no issue when using React Native Web, or React DOM for that matter.
And I did not find that the values provided are referentially different when using the same callback ref. I used a Set to keep track of how many distinct object references were passed.
Same problem. Here my environment information