Current behaviour
Typing in a react-native-paper TextInput with multiline inside a Portal causes rapid flicker and floods onChangeText (dozens of calls per second). Removing either Portal or multiline stops the issue.
Expected behaviour
No flicker; onChangeText fires once per user input.
How to reproduce?
- Render a multiline
TextInput inside a Portal.
- Run iOS
- Focus the field and type characters.
import * as React from 'react';
import { Portal, TextInput } from 'react-native-paper';
export default function Repro() {
const [text, setText] = React.useState('');
return (
<Portal>
<TextInput
label="Notes"
mode="outlined"
multiline
value={text}
onChangeText={(t) => {
console.count('onChangeText'); // spams rapidly
setText(t);
}}
style={{ minHeight: 120 }}
/>
</Portal>
);
}
What have you tried so far?
- Removing
multiline → issue gone
- Removing
Portal → issue gone
Your Environment
| software |
version |
| ios |
x |
| android |
x |
| react-native |
0.81.5 |
| react-native-paper |
5.14.5 |
| node |
x.x.x |
| npm or yarn |
x.x.x |
| expo sdk |
N/A |