React Native + Redux Form-在maxLength上轉到下一個字段

Question

您好，我想為Pin碼輸入4個，一切都很好，只是我想添加功能，所以當我們在Field1中編寫numer時，它將帶我們進入Field2等。這是我的代碼：

輸入組件：

 InputComponent = ({ input, meta, ...rest }) => (
    <Input {...rest} keyboardType="numeric" maxLength={1} value={input.value} onChangeText={input.onChange} />
  );

形成：

<Form style={styles.form}>
    <View style={styles.inputs}>
        <Field style={styles.input} name="pin1" component={this.InputComponent} placeholder="*" secureTextEntry />
        <Field style={styles.input} name="pin2" component={this.InputComponent} placeholder="*" secureTextEntry />
        <Field style={styles.input} name="pin3" component={this.InputComponent} placeholder="*" secureTextEntry />
        <Field style={styles.input} name="pin4" component={this.InputComponent} placeholder="*" secureTextEntry />
    </View>
</Form>

Answer 1

在這里您可以使用Ref來解決您的問題

這里

<FormInput
 ref='forminput'
 textInputRef='email'
 ...
 />

您應該能夠訪問類似於this.refs.forminput.refs.email.focus（）的引用 。 對於每個信號輸入。

使用focus將根據ref聚焦特定的輸入，這里是帶redux形式REDUX_FORM的ref的示例