20170819

import React, { Component } from 'react';
import {
    AppRegistry,
    StyleSheet,
    Text,
    View
} from 'react-native';

var Son = React.createClass({
    getDefaultProps() {
        console.log('child','getDefaultProps');
    },
    getInitialState(){
        console.log('getInitialState');
        return {
            times: this.props.times
        }
    },
    timePlus() {
        let times = this.state.times

        times++;
        this.setState({
            times: times
        })
    },

    componentWillMount() {
        console.log('child','componentWillMount');
    },
    componentDidMount() {
        console.log('child','componentDidMount');
    },
    componentWillReceiveProps(props) {
        console.log('child','componentWillReceiveProps');
        this.setState({
          times: props.times
        })
    },
    shouldComponentUpdate() {
        console.log('child','shouldComponentUpdate');
        return true;
    },
    componentWillUpdate() {
        console.log('child','componentWillUpdate');
    },
    componentDidUpdate() {
        console.log('child','componentDidUpdate');
    },

    timesReset() {
      this.props.timesReset();
    },

    render() {
        console.log('child','render');
        return (
            <View style={styles.container}>
              <Text style={styles.welcome} onPress={this.timePlus}>
                儿子：有本事揍我啊！
              </Text>
              <Text style={styles.instructions}>
                  你居然揍我{this.state.times}次
              </Text>
              <Text style={styles.instructions} onPress={this.timesReset}>
                信不信我亲亲你
              </Text>

            </View>
        );
    }
})

var MyApp = React.createClass({
  getDefaultProps() {
    console.log('father','getDefaultProps');
  },
  getInitialState(){
    console.log('father','getInitialState');
    return {
      hit: false,
      times: 2
    }
  },


  componentWillMount() {
    console.log('father','componentWillMount');
  },
  componentDidMount() {
      console.log('father','componentDidMount');
  },
  shouldComponentUpdate() {
      console.log('father','shouldComponentUpdate');
      return true;
  },
  componentWillUpdate() {
      console.log('father','componentWillUpdate');
  },
  componentDidUpdate() {
      console.log('father','componentDidUpdate');
  },
  timesReset(){
    this.setState({
      time: 0
    })
  },
  willHit(){
    this.setState({
      hit: !this.state.hit
    })
  },
  timePlus() {
      var times = this.state.times

      times += 3;
      this.setState({
          times: times
      })
  },

  render() {
    console.log('father','render');
    return (
      <View style={styles.container}>
        {
          this.state.hit
          ? <Son times={this.state.times} timesReset={this.timesReset}/>
          : null
        }
        <Text style={styles.welcome} onPress={this.timesReset}>
          老子说：心情好就放你一马
        </Text>
        <Text style={styles.instructions} onPress={this.willHit}>
            到底揍不揍
        </Text>
        <Text style={styles.instructions}>
            就揍了你{this.state.times}次而已
        </Text>
        <Text style={styles.instructions} onPress={this.timePlus}>
            不听话，再揍你3次
        </Text>
      </View>
    );
  }
})


var styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

AppRegistry.registerComponent('MyApp', () => MyApp);

getInitialState(){
    console.log('father','getInitialState');
    return {
      hit: true,
      times: 2
    }
  },

触发timePlus