React Native控制台日志代理对象

Question

我正在关注react-native教程，但我遇到了一些奇怪的结果。

这是代码

module.exports = React.createClass({
  getInitialState(){
    return({
      tasks: ['Take Course', "Clean house"],
      task: ''
    })
  },
  render() {
    return(
      <View style={styles.container}>
        <Text style={styles.header}>
          ToDoList
        </Text>
        <TextInput
          style = {styles.inputbox}
          placeholder="Type task"
          onChange={(text) => {
            this.setState({task: text});
            console.log(this.state.task);
          }}
        />
      </View>
    )
  }
}) 

我想使用console.log来打印来自text的{​​{1}}。

这是模拟器。

我原以为它会在Chrome控制台中打印TextInput，1和12。

但我得到了这个

为什么打印这个123对象，这个对象是什么？

Answer 1

使用onChangeText代替onChange。看看https://facebook.github.io/react-native/docs/textinput.html

此外this.setState是一个异步调用，这意味着在设置状态时它是未确定的。在这种情况下，您必须将console.log作为回调调用，以确保状态已更改。

this.setState({
   task: text
}, () => {
   console.log(this.state.task)
})