react为什么要废弃三个生命周期?

参考:https://blog.csdn.net/weixin_40629244/article/details/120827408(重要)
参考:https://blog.csdn.net/Whoopsina/article/details/122871193

废弃的三个生命周期:

  • componentWillMount
  • componentWillUpdate
  • componentsWillRecieveProps

废弃原因:

  1. filber的机制下,生命周期分为render和commit的阶段,render的时候是可以被打断的,重新渲染,终止的,当一个任务执行到一半被打断后,下一次渲染线程抢回主动权时,这个任务被重启的形式是“重复执行一遍整个任务”而非“接着上次执行到的那行代码往下走”。这就导致 render 阶段的生命周期都是有可能被重复执行的,而你会发现废弃的这三个都是在render的阶段执行的,废弃这三个也是为了给fiber铺路。

试想,假如你在 componentWillxxx 里发起了一个付款请求。由于 render 阶段里的生命周期都可以重复执行,在 componentWillxxx 被打断 + 重启多次后,就会发出多个付款请求。
比如说,这件商品单价只要 10 块钱,用户也只点击了一次付款。但实际却可能因为 componentWillxxx 被打断 + 重启多次而多次调用付款接口,最终付了 50 块钱;又或者你可能会习惯在 componentWillReceiveProps 里操作 DOM(比如说删除符合某个特征的元素),那么 componentWillReceiveProps 若是执行了两次,你可能就会一口气删掉两个符合该特征的元素。

  1. componentWillReceiveProps 和 componentWillUpdate 里滥用 setState 导致重复渲染死循环的。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值