键入焦点到下一个文本输入后答案

【问题标题】：after typing focus to next text input键入焦点到下一个文本输入后
【发布时间】：2018-06-30 04:00:36
【问题描述】：

假设我有 3 个视图，其中包含 TextInput。

<View style={styles.row}>
    <TextInput
        ref={'cell_'+i}
        maxLength={1}
        spellCheck={false}
        style={styles.chewy}
        onKeyPress={this._onInputFilled} />
</View>
<View style={styles.row}>
    <TextInput
        ref={'cell_'+i}
        maxLength={1}
        spellCheck={false}
        style={styles.chewy}
        onKeyPress={this._onInputFilled} />
</View>
<View style={styles.row}>
    <TextInput
        ref={'cell_'+i}
        maxLength={1}
        spellCheck={false}
        style={styles.chewy}
        onKeyPress={this._onInputFilled} />
</View>

注意ref={'cell_'+i} 其中i 等于0..2。现在，当我在cell_0 中输入一个字符时，如何将焦点（移动光标）移到下一个 TextInput 即。cell_1?

【问题讨论】：

现在您可以输入 cell_0 何时移至 cell_1 ？
此链接可能会有所帮助：stackoverflow.com/questions/32748718/…

标签： javascript react-native

【解决方案1】：

试试这个代码：

<View style={styles.row}>
    <TextInput
        ref={'cell_'+i}
        maxLength={1}
        spellCheck={false}
        style={styles.chewy}
        onKeyPress={this._onInputFilled}
        onSubmitEditing={() => this.focusNextField('cell_' + (i+1))}
        />
</View>
<View style={styles.row}>
    <TextInput
        ref={'cell_'+i}
        maxLength={1}
        spellCheck={false}
        style={styles.chewy}
        onKeyPress={this._onInputFilled}
        onSubmitEditing={() => this.focusNextField('cell_' + (i+1))}
        />
</View>
<View style={styles.row}>
    <TextInput
        ref={'cell_'+i}
        maxLength={1}
        spellCheck={false}
        style={styles.chewy}
        onKeyPress={this._onInputFilled}
        />
</View>

onSubmitEditing：

focusNextField = nextField => {
   this.refs[nextField].focus();
};

【讨论】：