每个React开发者，每天都会用到setState，调用setState来触发组件的渲染。
然鹅~你真的认识setState吗？？
image.png
看一个简单的问题：
addTitle(){
const currentList = this.state.list
console.log(this.state.list)
this.setState={list:currentList}
console.log(this.state.list)
}
//前后两次console的输出是一样的
为什么state需要异步？
每次setState都会触发render，可能会执行多次setstate，即使每次重复渲染，用户都看不到过程，只需要关注最后的执行结果。
这样做法的好处是，没必要每次setstate都重新渲染，考虑性能问题，可以将多次状态的改变进行合并，看到最终的结果
setState的执行过程
1、每次组件的实例，都有一个renderComponent方法，执行path(container,vnode)，vnode存值为preVnode，用于下次做新旧node树对比
2、执行renderComponent会重新执行实例的render
3、render函数返回newVnode，然后拿到preVnode
4、执行path(preVnode,newVnode)
网友评论