returnKeyType = react native 中的“下一个”问题

Posted 2023-04-18

【中文标题】returnKeyType = react native 中的“下一个”问题

【英文标题】：returnKeyType = "next" issue in react native

【发布时间】：2018-06-26 08:42:27

【问题描述】：

我在 TextInput 组件中使用 returnKeyType = "next"，但它的工作方式类似于 returnKeyType="go"，而不是移动到下一个文本输入字段。

我们如何使用键盘上的“下一步”按钮从一个文本输入字段移动到下一个文本输入字段？

【问题讨论】：

这能回答你的问题吗？ React Native: How to select the next TextInput after pressing the "next" keyboard button?

【参考方案1】：

您需要使用如下引用将焦点设置在下一个文本字段上：

<View style=flex:1>
    <TextInput style=height:40 
        placeholder="First TextField Input"
        placeholderTextColor="#DCDCDC"
        returnKeyType="next"
        onSubmitEditing=()=>this.secondTextInput.focus()/>
    <TextInput style=height:40 
        placeholder="Second TextField Input"
        placeholderTextColor="#DCDCDC"
        returnKeyType="go"
        ref=(input)=>this.secondTextInput = input/> 
</View>

【讨论】：

这是一种错误的实现方式，因为它会在“下一次”按下时隐藏键盘，然后在焦点上它会再次弹出，而不是只关注下一个字段而不关闭键盘

@AlwaysConfused：你可以提出答案，而不是投反对票

@HimanshuDwivedi 知道什么是不好的解决方案和真正知道答案是有区别的

@hardworker 能否请你为这个问题提出你的好答案，而不是投反对票，我不是专家，只是一个学习者。

在第一个 TextInputField 上设置 blurOnSubmit=false 以避免键盘关闭