实例化 > 存在期 > 销毁&清理期
实例化
首次使用一个组件类时,实例化期间以下方法依次调用
- getDefaultProps (ES6 defaultProps)
(对组件来说只调用一次.对于父组件没有指定props的新建实例,返回对象可以用于设置默认props.)
复杂值(对象,数组)会被所有实例共享而不是拷贝或克隆.
该方法是在createClass调用时调用的,因此不能在该方法中使用实例数据 - getInitialState (ES6 constructor)
对于组件的每一个实例,只会被调用一次.用于初始化state,这里可以访问this.props(因为上一个方法已经初始化this.props) - componentWillMount
首次渲染之前调用,可以修改state - render
创建虚拟DOM用于组件输出.对于组件来说是唯一一个必须的方法
render需要满足以下几点
只能通过this.state或this.props访问数据
可以返回null,false,或者任何react组件
只能出现一个顶级组件
不能改变组件状态或DOM输出 - componentDidMount
对调用render后渲染出的DOM做后续操作通过在该方法内部使用this.getDOMNode获取渲染后的DOM从而进行后续操作
该组件类的后续应用,以下方法依次被调用
getInitialState
componentWillMount
render
componentDidMount
存在期
已渲染好的组件与用户交互的时期,用户操作改变应用状态.随着应用状态的改变,以及组件逐渐受到影响.以下方法依次调用
- componentWillReceiveProps
该方法组件的props在被父辈组件修改时调用,在方法中可以改变props和state的值 - shouldComponentUpdate
用于优化组件加载速度,返回false时该组件不进行渲染且不执行render前后的两个方法
首次渲染和执行forceUpdate方法后不调用该方法 - componentWillUpdate
与componentWillMount类似,但该方法不可改变props或state的值 - render
同上 - componentDidUpdate
与componentDidMount类似
销毁&清理期
组件移出之前componentWillUnmount将被调用,组件实例清理自身.例如 撤销定时器或者事件监听
网友评论