# 状态 - State

# State 的更新可能是异步的

和 Vue 的异步更新队列一样, React 的 state 也不一定会同步更新. 这个时候, 使用 state 来更新 state 就不能做到及时更新.

this.state = {
  count: 10
};

this.setState({
  count: this.state.count + 1
}); // 可能会异步更新

1
2
3
4
5
6
7

为了解决这个问题, setState()就不接受一个对象而是函数了:

this.setState((state, props) => {
  return {
    count: state.count + props.xxx
  };
});

1
2
3
4
5

第一个参数表示更新前的 state, 第二个参数就是传入的 props.

this.state = {
  a: 1,
  b: 2
}

componentDidMount(){
  this.setState({
    b: 22
  })
}

// state: {a: 1, b: 22}

1
2
3
4
5
6
7
8
9
10
11
12

setState()只会更新传入的 state 的部分, 不会更改其他的 state.