如何在React Native中按下enter键时禁用在多行TextInput中插入新行

Question

我想构建一个多行TextInput聊天应用程序，用户可以在按下回车键时发送消息。然而，当用户按下回车键时，似乎无论如何都会插入新行，这会给用户带来不好的体验。

我试过在react native中按下回车键时如何防止新行，但在用户按下键盘上的回车键后，新行仍然存在。当onChangeText被激发时，我也试图修剪文本，但似乎新行仍然被插入。我知道它在blurOnSubmit=true时工作，但我想在用户点击回车键时保持键盘打开。

Answer 1

只需将其添加到TextInput中即可->blurOnSubmit＝｛true｝

例如：

<TextInput multiline={true} numberOfLines={1} blurOnSubmit={true} />

Answer 2

您可以检查我们从onChangeText获得的更新字符串中的换行符，并相应地更新状态。通过这样做，键盘不会被忽视。

在这里实现

onChangeText函数应该是这样的。

// function to handle onChangeText
const handleTextChange = (text: string) => {
if (text.length) {
let checkLineBreak = /r|n/.exec(text[text.length - 1]);
if (checkLineBreak) {
console.log(
'Execute Something which you want to when user presses the enter key'
);
ToastAndroid.show('Enter Pressed keyboard not dimissed', 3000);
}
}
SetMessage(text.trimEnd());
};