共计 685 个字符,预计需要花费 2 分钟才能阅读完成。
一、三个阶段
初始化阶段
- constructor: 构造函数,初始化组件实例
- getDefaultProps: 获取实例的默认属性(React.createClass())
- getInitialState: 获取每个实例的初始化状态(React.createClass())
- componentWillMount: 组件行将被挂载、渲染到页面上
- render: 组件在这里生成虚构的 DOM 节点
coponentDidMount: 组件真正在被挂载之后
运行中状态
- componentWillReceiveProps: 组件将要接管到属性的时候调用
- shouldComponentUpdate: 组件接管到新属性或者新状态的时候(能够返回 false, 接收数据后不更新,阻止 render 调用,前面的函数不会继续执行了)
- componentWillUpdate: 组件行将更新,不能批改属性和状态
- render: 组件从新描述
- getSnapshotBeforeUpdate: 使得组件能在产生更改之前从 DOM 中捕捉一些信息(例如,滚动地位)
- componentDidUpdate: 组件曾经更新, 在这个生命周期外面不能应用 setState()
销毁阶段
- componentWillUnmount: 组件行将销毁
二、具体钩子详解
1.shouldComponentUpdate 是做什么的?
shouldComponentUpdate 这个办法用来 判断是否须要调用 render 办法从新描述 DOM。因为 DOM 的描述十分耗费性能,如果咱们能在 shouldComponentUpdate 办法中可能写出更优化的 dom diff 算法,能够极大的进步性能。
正文完
发表至: javascript
2020-09-10