在将状态设置为"Enter name"字段的值时遇到问题

Question

我有一个简单的文本输入来输入你的名字。我想把它传递给另一个场景。不过，首先，我想将值保存到当前组件的状态中。当我打开调试器时，我每console.log(this.name)都会得到undefined。

这是我的代码：

  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)
}

你知道为什么我总是被"未定义"作为名称的值吗？设置与正在键入的状态等效的状态的正确方法是什么？

仅在按下提交按钮后设置状态是否更好？如果是这样，如何做到这一点？

Answer 1

您正在尝试访问this.name，这是在您的情况下检查组件对象上的（可能不存在的）name属性。你应该看看this.state.name.但是，即使您确实尝试通过 this.state.name 注销事件处理程序中的更新状态，您仍然可能遇到问题。来自 React 文档：

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

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