参考:https://blog.csdn.net/weixin_40629244/article/details/120827408(重要)
参考:https://blog.csdn.net/Whoopsina/article/details/122871193
废弃的三个生命周期:
- componentWillMount
- componentWillUpdate
- componentsWillRecieveProps
废弃原因:
- filber的机制下,生命周期分为render和commit的阶段,render的时候是可以被打断的,重新渲染,终止的,当一个任务执行到一半被打断后,下一次渲染线程抢回主动权时,这个任务被重启的形式是“重复执行一遍整个任务”而非“接着上次执行到的那行代码往下走”。这就导致 render 阶段的生命周期都是有可能被重复执行的,而你会发现废弃的这三个都是在render的阶段执行的,废弃这三个也是为了给fiber铺路。
试想,假如你在 componentWillxxx 里发起了一个付款请求。由于 render 阶段里的生命周期都可以重复执行,在 componentWillxxx 被打断 + 重启多次后,就会发出多个付款请求。
比如说,这件商品单价只要 10 块钱,用户也只点击了一次付款。但实际却可能因为 componentWillxxx 被打断 + 重启多次而多次调用付款接口,最终付了 50 块钱;又或者你可能会习惯在 componentWillReceiveProps 里操作 DOM(比如说删除符合某个特征的元素),那么 componentWillReceiveProps 若是执行了两次,你可能就会一口气删掉两个符合该特征的元素。
- componentWillReceiveProps 和 componentWillUpdate 里滥用 setState 导致重复渲染死循环的。