组件未插入真实DOM
componentWillMount()
- 组件Render前执行
- 只执行一次
- 在componentWillMount中做的事都可以放到constructor()中做
componentDidMount()
- 组件Render后执行
- 只执行一次
- render返回一个jsx对象-->react调用createElement()读取该jsx对象属性，用于构造虚拟DOM-->虚拟DOM插入文档，成为真实DOM
组件被重新渲染(更新的过程实质是子组件接收父组件参数后重新render的过程)
compentWillReceiveProps(nextprops)
- 父组件为子组件传递参数后，触发子组件调用该函数(不管父组件的props是否改变)
- 写日志
componentWillReceiveProps(nextProps)
{
console,log("当前props日志")
console.log("current: "+this.props.name)
console.log("next: "+nextProps.name)
}
shouldComponentUpdate(nextProps, nextState)
- state或props改变时都会触发
- 返回true时，启用diff算法(结合key)进行Virtual DOM的计算与比较，从而得出DOM树的最小修改量，再交给componentWillUpdate()去执行
- 避免节点被重复渲染
if(nextProps.item.name!==this.props.item.name)
{
return true;
}
else
{
return false;
}
componentWillUpdate()
组件移出真实DOM
componentDidUpdate()
- 执行完后触发render
componentWillUnmount()
-
我们为组件注册的事件必须在该函数中卸载
