React Native:如何选择以前的文本输入

时间:2017-09-25 11:52:14

标签: javascript reactjs react-native

我已将代码定义为关注下一个TextInput字段

 <View>
     <TextInput
         ref="1"
         maxLength = {1}
         keyboardType={"numeric"}
         onChangeText={(pC1) => this.focusNextField('2',pC1)}
         value={this.state.pC1}
     />
     <TextInput
         ref="2"
         maxLength = {1}
         keyboardType={"numeric"}
         onChangeText={(pC2) => this.focusNextField('3',pC2)}
         value={this.state.pC2}
     />
     <TextInput
          ref="3"
          maxLength = {1}
          keyboardType={"numeric"}
          onChangeText={(pC3) => this.focusNextField('',pC3)}
          value={this.state.pC3}
      /> 
  </View>

以下是为文本输入光标移位而编写的函数 前进方向。但是如何反向实施 顺序。也就是说,按退格(键盘)

  focusNextField(nextField,pinCode) {
      if(nextField=="2"){
        if(pinCode!=''){
          this.state.pC1=pinCode; // Set value for PC1
          this.refs[nextField].focus();//Goes to TextInput whose ref == 2
        }else{
          this.state.pC1='';
          nextField="1";
          this.refs[nextField].focus();
        }
      }else if(nextField=="3"){
        if(pinCode!=''){
          this.state.pC2=pinCode; // Set value for PC2
          this.refs[nextField].focus();//Goes to TextInput whose ref == 3
        }else{
          this.state.pC2='';
          nextField="2";
          this.refs[nextField].focus();
        }
      }else if(nextField==""){
        if(pinCode!=''){
          this.state.pC3=pinCode; // Set value for PC3
        }else{
          this.state.pC3='';
          nextField="3";
          this.refs[nextField].focus();
        }
      }
    this.forceUpdate(); //Update the Component
  }

在上面的代码中,我可以从一个TextInput向前移动到另一个。{ 我的问题是:如果删除,我怎样才能专注于之前的TextInput TextInput数据?

1 个答案:

答案 0 :(得分:0)

我假设您正在寻找的行为是:如果输入不为空,请关注next,如果有,如果输入为空,请关注先前(如果有)。我建议你通过如下声明映射来降低函数的复杂性:

block()

您需要在标记中进行的唯一更改是将当前字段发送到方法而不是下一个字段。