Question

对于多行textinput，当用户按下回车键时，我想实现目标：

当用户按下回车键时，保持textinput焦点。
阻止添加新行。

我没有看到任何道具能做什么，谁有想法？

react-native版本是0.28+，需要支持ios和android。

Answer 1

在TextInput中传递道具

blurOnSubmit = {true}然后在onBlur道具中使用ref聚焦textInput字段，这两个将阻止进入新行并且焦点保留在文本输入字段上。如果您只想阻止用户输入换行符blurOnSubmit = {true}就足够了

这里的缺点是你可以看到键盘隐藏片刻，然后弹出。它有点像黑客。希望有人可以提出另一个或即兴创作

Answer 2

您可以使用多行设置TextInput并将blurOnSubmit设置为false。这将保持键盘并允许输入中的多行。

仅使用onKeyPress道具发送消息。

onKeyPress({ nativeEvent: { key: keyValue } }) {
    if (keyValue === "Enter") this.sendMessage();
}

与

onMessageInputChange(message) {
    this.setState({
        message,
    });
}

这应该适用于Android和iOS。

            <TextInput
                value={message}
                onChangeText={this.onMessageInputChange}
                onKeyPress={this.onKeyPress}
                returnKeyType="send"
                blurOnSubmit={false}
                multiline
            />

Answer 3

以下是示例：

＆＃13;

$(".Post_Description_Text").keydown(function(e) {
  if (e.keyCode == 13 && !e.shiftKey) {
    e.preventDefault();
    alert("New line entered");
  }
});

＆＃13;

.Post_Description_Text {
  width: 500px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<textarea name="comment_text" id="comment_text" class="Post_Description_Text"></textarea>

＆＃13;

如何在反应原生中按下进入时防止换行

3 个答案: