我实际上知道如何做到这一点，但我需要一种不同的方法。
所以我有文本输入，如：
<TextInput returnKeyType='next'
ref={ref => this.someName = ref}
onSubmitEditing={(event) => { this.nextFieldName.focus() }}/>
技巧是我不想为下一个字段使用特定的名称，而是简单地关注下一个（如果有的话）。
这可能吗？
如何将下一个输入（如果有）聚焦在下一次按下
IT技术
reactjs
react-native
2021-05-06 05:41:29
2个回答
你的问题有点宽泛。如果您提供更多详细信息，我可能会有所帮助，但现在让我举个例子。
假设您有一个数据数组，您正在通过这些数据进行映射并创建一个表单。
const data = [
{
type: 'text',
value: 'name'
},
{
type: 'text',
value: 'surname'
},
{
type: 'number',
value: 'age'
}
];
现在让我们遍历数据
data.map((field, index) => {
return (
<TextInput
type={field.type}
value={this.state[field.value]}
ref={(ref) => this.refs[index] = ref}
onSubmitEditing={() => this.onSubmitEditing(index)}
/>
);
});
现在因为我们知道我们在哪个字段以及是否存在另一个字段，我们可以关注或提交表单。
onSubmitEditing = (index) => {
if (data.length <= (index + 1)) {
this.refs[index + 1].focus();
} else {
// no input to move
// submit form
}
}
假设您有 2 个 textInputs，那么如果您按下next，这就是下一个输入的聚焦方式：
<TextInput returnKeyType='next'
onSubmitEditing={(event) => { this.someName.focus() }}
/>
<TextInput returnKeyType='next'
ref={ref => this.someName = ref}
/>