Блог

Это код, в котором я отображаю входные значения

            <View style={styles.dobContainer}>
                    <View>{this.renderInput('dd', 'DD', formikProps)}</View>
                    <View>{this.renderInput('mm', 'MM', formikProps)}</View>
                    <View>{this.renderInput('yyyy', 'YYYY', formikProps)}</View>
                  </View>

  

и это функция renderInput .Я хочу переместить фокус на месяц, если пользователь ввел две цифры и изменил их с месяца на год.

 renderInput = (field, placeholder, formikProps) => {
        console.log("formikProps", formikProps);
        const { values, errors, touched } = formikProps
        let refval;
        let ddref = React.createRef();
        let mmref =React.createRef();
        let  yyref =React.createRef();
        if( field ==='dd'){
          refval =ddref;
        }else if(field === 'yyyy'){
          refval = yyref;
        }
        else {
          refval = mmref;
        }
          
        console.log("refval is ",refval);
        return(
            <View>
                <TextInput
                maxLength = {2}
               
                ref={(refval) => { this.refval = refval}}
                 onChangeText={()=>this.valuesandMove(field,formikProps,refval)}
               
                keyboardType='numeric'
                style={styles.textDesign} 
                placeholder={placeholder}
                  />
                {formikProps.errors amp;amp; formikProps.errors[field] amp;amp; <Text style={styles.errorStyle}>{formikProps.errors amp;amp; formikProps.errors[field]}</Text>}
            </View>
        )
      }
  

Однако использование ссылок, похоже, не работает.

   valuesandMove =(field,formikProps,refval) =>{
      
      formikProps.handleChange(field);
      console.log("movetonext",field,formikProps.values,refval);
      let dd = formikProps amp;amp; formikProps.values amp;amp; formikProps.values.dd;
      let mm = formikProps amp;amp; formikProps.values amp;amp; formikProps.values.mm;
      console.log("this.refs",this.refs);
      if(field == "dd"  amp;amp; dd >9  amp;amp; dd< 31 ){
       // this.refs.mm.focus();
      }
    }
  

Я вижу, что this.refs пуст.

Единственный способ заставить его работать

 let mmref =React.createRef();
<InputFormik
                    formikKey="dd"
                    formikProps={formikProps}
                    placeholder="dd"
                    keyboardType="default"
                    autoCapitalize="words"
                    autoCorrect={false}
                    returnKeyType="next"
                    onSubmitEditing={() => {
                      mmref.focus();
                    }}
                  />

                  <InputFormik
                    formikKey="mm"
                    formikProps={formikProps}
                    ref={(child) => {
                      if (child) {
                        mmref = child.refProp;
                      }
                    }}
                    placeholder="mm"
                    keyboardType="default"
                    autoCapitalize="words"
                    autoCorrect={false}
                    returnKeyType="next"
                  />