React Native新手求助：如何正确将TextInput输入内容打印至控制台

嗨，刚入门React Native碰到这个问题太正常啦！我给你把问题掰得明明白白，再给你最简单的解决办法～

问题出在哪？ #

你代码里的setState是异步更新状态的！意思是你调用setState之后，React不会立刻把textValue改成新值，它会攒着一批更新一起处理。所以你刚调用完setState就立刻console.log(this.state.textValue)，打印的还是更新前的旧值，自然看不到刚输入的内容。

两种简单解决办法 #

方法一：直接打印传入的text（最推荐！） #

你的_textChange函数已经拿到了用户刚输入的最新文本text，直接打印这个参数就行，完全不用等state更新：

_textChange = (text) => {
  this.setState({
    textValue: text,
  })
  console.log(text); // 直接打印刚拿到的输入值，一步到位！
}

方法二：用setState的回调函数（适合需要用更新后state的场景） #

如果之后你需要用到更新完成后的state来做其他操作，可以用setState的第二个参数——一个回调函数，这个函数会在state彻底更新完成后才执行：

_textChange = (text) => {
  this.setState({
    textValue: text,
  }, () => {
    // 这里的state已经是最新的啦
    console.log(this.state.textValue);
  })
}

额外小优化：简化this绑定 #

你用了箭头函数定义_textChange，箭头函数会自动继承外层组件的this，所以TextInput里不用写.bind(this)，直接这样写就行：

<TextInput onChange={this._textChange} />

这样改完，你输入内容的时候就能在控制台看到实时的输入值啦～

内容的提问来源于stack exchange，提问作者pratteek shaurya