无法将状态设置为“输入名称”字段的值

Question

我有一个简单的TextInput用于输入您的姓名。 我想将此传递给另一个场景。 不过，首先，我想将值保存到当前组件的状态。 当我打开调试器，我得到undefined每一个console.log(this.name)我有。

这是我的代码：

  constructor(props) {
    super(props);
    this.state = {
      name: ''
    };
  }

<TextInput style={styles.inputName}
  placeholder="Enter your name"
  textAlign="center" 
  onChange={this.handleChange.bind(this)} />

handleChange(event) {
  this.setState({
  name: event.nativeEvent.text
  });
  console.log(this.name)
}

您知道为什么我总是得到“ undefined”作为name的值吗？ 将状态设置为与要键入的状态等效的正确方法是什么？

是否只有在按下提交按钮之后才可以设置状态？ 如果是这样，那怎么办？

Answer 1

您正在尝试访问this.name ，它正在检查案例中组件对象上的（可能不存在）name属性。 您应该查看this.state.name 。 但是，即使您确实尝试通过this.state.name事件处理程序中的更新状态，也可能仍然会遇到问题。 从React docs ：

setState（）不会立即使this.state发生突变，但会创建一个挂起的状态转换。 调用此方法后访问this.state可能会返回现有值。

最后，我建议通过event.target.value从事件中提取名称值，而不要通过nativeEvent属性。