react--state

state属性：

• state对于模块来说，属于自身属性;
• 初始化：this.state = {name:'xiaoming'};
• 初始化可以放置在构造函数 constructor 中；
• 修改state ：this.setState({name: 'xiaohong'});
• state的作用域只属于当前的类，不污染其他模块

import React from 'react';

export default class BodyIndex extends React.Component{

  constructor() {
    super(); // 调用基类的所有初始化方法
    this.state = { // 组件两个重要属性之一（state：（对模块来说，属于 自身属性）主要是定义自身组件的一些属性；props：（对模块来说，属于 外来属性）接受外面组件传进来的数据）。
      name: 'xiaoming',
      age: 20
    }
  }

  render(){
    setTimeout(() => {
       this.setState ({ // 改变state属性，setState
         name: 'honghong'
       })
    }, 2000);
    return (
      <div>
        <h2>页面的主体内容</h2>
        <p>{this.state.name}</p> 
        <p>{this.state.age}</p>
      </div>
    )
  }
}

setState的回调函数

不在回调中使用参数，我们在设置state后立即使用state：
this.state = {foo: 1};
this.setState({foo: 123});
console.log(this.state.foo);
// 1


在回调中调用设置好的state
this.state = {foo: 2};
this.setState({foo: 123}, ()=> {
    console.log(foo);
    // 123
});

关于setState的回调函数的作用大概如此，这个函数相当于componentDidUpdate函数，和生命周期的函数类似。