react-native之每隔一秒刷新页面

效果图：

index.android.js:

'use strict';
import React,{Component} from 'react';
import {AppRegistry,Text,View} from 'react-native';
class Blink extends Component{
    // 构造
      constructor(props) {
        super(props);
        // 初始状态
        this.state = {showText:true};
          setInterval(()=>{
              this.setState({showText:!this.state.showText})//每个一秒，showText的值取反。原来的值是这样子获取this.state.showText
          },1000);
      }
    render(){
        let display = this.state.showText ? this.props.text : ' ';//三目运算，如果是true，显示四个组件的值，否则，显示空白
        return(
           <Text>{display}</Text>
        )
    }
}
class BlinkApp extends Component{
    render(){
        return(
            <View>
                <Blink text='I love to blink' />
                <Blink text='Yes blinking is so great' />
                <Blink text='Why did they ever take this out of HTML' />
                <Blink text='Look at me look at me look at me' />
            </View>
        )
    }
}
//MyFirstProject 必须初始化的项目名字
AppRegistry.registerComponent('MyFirstProject',() => BlinkApp);

ps:实际开发中，我们一般不会在定时器函数（setInterval、setTimeout等）中来操作state。