菜单 学习猿地 - LMONKEY

VIP

开通学习猿地VIP

尊享10项VIP特权 持续新增

知识通关挑战

打卡带练!告别无效练习

接私单赚外块

VIP优先接,累计金额超百万

学习猿地私房课免费学

大厂实战课仅对VIP开放

你的一对一导师

每月可免费咨询大牛30次

领取更多软件工程师实用特权

入驻
87
0

React v16.9 中unsafe的生命周期函数

原创
05/13 14:22
阅读数 690
https://zh-hans.reactjs.org/b...

Unsafe的生命周期

  • componentWillMount → UNSAFE_componentWillMount

    • 没有用过,不描述
  • componentWillReceiveProps → UNSAFE_componentWillReceiveProps

    • 原因:

      • 在一次渲染周期内,props多次变化,造成该函数重复调用。
      • 父组件触发子组件重新渲染,即使props未变化,依然会调用该函数
    • 方案

      1. 在render中处理最终需要的渲染相关数据

        • componentShouldUpdate 仅处理 props 相关
        • 使用memoize
      2. 使用getDerivedStateFromProps,仅会在渲染前调用,返回值应用于state,不通过setState队列。

        • packagesreact-domsrcserverReactPartialRenderer.js
  • componentWillUpdate → UNSAFE_componentWillUpdate

    • 原因:

      • 设计用于保存组件在渲染前的状态,比如读取dom信息中的滚动值等。
      • 但实际中,可能会调用setState或者触发react-redux中的action
    • 方案

发表评论

0/200
87 点赞
0 评论
收藏
为你推荐 换一批