我有一个问题,当我在 TextInput 中输入垃圾邮件并单击按钮提交并清除文本时,它会变得滞后,并且不会立即清除 TextInput 中的文本。 当我在屏幕上有大量内容(如 Lorem Ipsum 文本)时,就会发生这种情况。 这对我来说是一个问题,因为我正在开发一个聊天应用程序,每当聊天日志很大并且用户快速键入并提交消息时,它不会立即被清除,并且仍然保留在 TextInput 中,这是不好的可用性。我用 ref 和受控 TextInput 尝试过(没有区别)。
您可以在我的 gif 中看到问题:
https://snack.expo.io/s22hVf140我的留言:
const MyMessages = () => {
const [messages, setMessages] = useState([]);
const addMessage = (text) => {
const arr = [text, ...messages];
setMessages(arr);
};
return (
<View>
<MyTextInput addMessage={addMessage}></MyTextInput>
{messages.map((msg, i) => {
return <Text key={i}>{msg}</Text>;
})}
<Text>
Lorem ipsum.......
</Text>
</View>
);
};
我的文本输入:
const MyTextInput = ({ addMessage }) => {
const [text, setText] = useState("");
const myRef = useRef();
const submit = () => {
myRef.current.clear();
addMessage(text);
};
return (
<View>
<TextInput
ref={myRef}
style={{
width: "100%",
height: 50,
backgroundColor: "lightgrey",
marginTop: 50,
}}
onChangeText={(text) => setText(text)}
></TextInput>
<Button title="submit" onPress={submit}></Button>
</View>
);
};
有人知道为什么屏幕上显示大内容时会发生这种情况吗?