React Native基础：4-状态State

通过组件的属性(Props)可以传递数据到组件内部，但属性的值是不能改变的。本节会介绍React Native中另一个重要的概念——状态(State)。State和Props都是用来存储数据的，Props是在父组件中指定，而且一旦指定，在组件的生命周期中就不能够再改变。 对于需要改变的数据，我们则需要使用到State，State一般用来记录组件的内部数据。

一般来说我们需要在组件的构造函数（constructor）中对State进行初始化，构造函数会接收来自外部传递的Props。接下来我们来给上一节创建的Hello组件添加一点新功能，让后面的名字闪烁起来。在State中保存一个showText变量来控制组件的显示内容，并且设置了一个定时器，每一秒钟改变一次showText变量的值，从而让文字不停的闪烁。

class Hello extends Component {
  constructor(props) {
    super(props);
    this.state = { showText: true };
    // 每1000毫秒对showText状态做一次取反操作
    setInterval(() => {
      this.setState({ showText: !this.state.showText });
    }, 1000);
  }
  
  render() {
    //showText为真，则显示name属性，showText为假，则显示hi
    let display = this.state.showText ? this.props.name : 'hi';
    return (
      <Text>{display}</Text>
    );
  }
}

在终端中切换到项目所在的目录，并输入react-native run-ios命令运行程序，耐心的等待应用的编译，然后就可以看到下方的效果。

---