关于thisState的那些事

1.state的定义

  状态(state) 和 属性(props) 类似,都是一个组件所需要的一些数据集合,但是它是私有的,并且由组件本身完全控制,可以认为它是组件的“私有属性(或者是局部属性)”。

2.thisState的三件事

  1.不要直接修改state的值

1 this.setState({
2   comment: 'Hello'
3 });

  2.state(状态)的更新可能是异步的

  React 为了优化性能,有可能会将多个 setState() 调用合并为一次更新。

  因为this.propsthis.state 可能是异步更新的,你不能依赖他们的值计算下一个state(状态)。

1 this.setState({
2   counter: this.state.counter + this.props.increment,
3 });

  我们并不能通过上述代码得到想要的值,为了弥补这个问题,使用另一种 setState() 的形式,接受一个函数。这个函数将接收前一个状态作为第一个参数,应用更新时的 props 作为第二个参数,代码如下:

1 this.setState((prevState, props) => ({
2   counter: prevState.counter + props.increment
3 }));

  3.state(状态)更新会被合并

  当你调用 setState(), React 将合并你提供的对象到当前的状态中。所以当State是一个多键值的结构时,可以单独更新其中的一个,此时会进行“差分”更新,不会影响其他的属性值。

原文地址:https://www.cnblogs.com/jack-wangsir/p/13027966.html