Question

我希望在隐藏后关注TextInput。我不知道我的代码有什么问题。需要帮助！

这是我的代码：

React.Component {
  state = {
    isEditing: false
  }

  onEdit() {
    this.setState({isEditing: true});
    this.textInput.focus();
  }

  render() {
    return (
      <View>
        {isEditing ? (
        <TextInput ref={(input) => this.textInput = input} value="Hello, World!"/>
        ) : (
        <Text>Hello, World!</Text>
        <TouchableOpacity onPress={this.onEdit.bind(this)}>
          <Text>Edit</Text>
        </TouchableOpacity>
        )}
      </View>
    )
  }
}

Answer 1

complete是异步调用，您必须等待它完成。做：

setState

但在您的情况下，即使onEdit() { this.setState({isEditing: true}, () => { this.textInput.focus(); }); }完成，textInput也可能尚未准备就绪。您从setState进行ref回调，这可能比您的textInput回调慢。在您的情况下，每次setState显示时，都需要重点关注，建议将焦点设置到位

<TextInput />

或者<TextInput ref={(input) => { input.focus(); this.textInput = input; } value="Hello, World!"/>内部setTimeout回调可以解决问题。

Answer 2

你还有一个＆＃34;拼写错误＆＃34;有条件的： {isEditing ? ( ... )}

应该是：{this.state.isEditing ? ( ... )}

React Native TextInput在显示后不会聚焦

2 个答案: