react-native - 将焦点转移到下一个 TextInput [error = this2.refs.LastName.focus 不是函数]

Question

我想将 TextInput 的焦点转移到下一个 TextInput 但它无法成功。

我的努力：

为焦点 TextInput 设置 autofocus 为 true

将 returnType 设置为 next 以在键盘旁边添加按钮

并将 onSubmitEditing 用于调用事件 [将焦点转移到下一个 TextInput]

这是我的代码

<View>
                    <Block width={width * 0.8}>
                      <Input
                        placeholder= 
                      {this.props.navigation.getParam("myJSON")}
                        style={{marginTop:20, borderRadius:30, 
                          borderWidth:3}}
                        onChangeText={FirstName => 
                        this.setState({FirstName})}

                        iconContent={
                          <Icon
                            size={16}
                            color={argonTheme.COLORS.ICON}
                            name="nav-right"
                            family="ArgonExtra"
                            style={styles.inputIcons}
                          />
                        }
                      returnKeyType = {"next"}

                      autoFocus = {true}

                      onSubmitEditing={(event) => { 
                      this.refs.LastName.focus(); 
                      }}
                      />
                    </Block>

                     <Block width={width * 0.8}>
                      <Input
                        ref='LastName'
                        placeholder= 
                          {this.props.navigation.getParam("myJSON1")}
                        style={{marginTop:20, borderRadius:30, 
                        borderWidth:3}}
                        onChangeText={LastName => this.setState({LastName})}
                        iconContent={
                          <Icon
                            size={16}
                            color={argonTheme.COLORS.ICON}
                            name="nav-right"
                            family="ArgonExtra"
                            style={styles.inputIcons}
                          />
                        }
                      />
                    </Block>

错误==>

_this2.refs.LastName.focus 不是函数

标签： react-nativekeyboard

Answer 1

我看到您使用的是native-base。

如果那是对的，那么你与现有的不同 react-native Textinput.

你可以试试这个：

this.refs.LastName._textInput.focus()

或者

this.refs.LastName._root.focus()

用法可能因本机基础版本而异。