React生命周期
Mounting(加载阶段: 4个钩子函数)
加载时调用,初始化 state
-
static getDerivedStateFromProps(props, state)
当父组件的render()执行,此函数也会执行,需要return 不然会报错props 父组件传来的props state 本组件的state值
每次接收新的props之后都会返回一个对象作为新的state,返回null则说明不需要更新state -
render()
最重要的步骤,创建虚拟DOM,进行diff算法,更新DOM树都在此函数进行 -
componentDidMount()
组件渲染完成调用,只调用一次
在此函数发送ajax/axios请求
Updating(更新阶段:5个钩子函数)
-
static getDerivedStateFromProps(props, state)
当父组件的render()执行,此函数也会执行,需要return 不然会报错
每次接收新的props之后都会返回一个对象作为新的state,返回null则说明不需要更新state -
shouldComponentUpdate(nextProps, nextState)
组件接收到新的props或者state时调用
return true就会更新dom(使用diff算法更新)
return false能阻止更新(不调用render)