react页面渲染之前_react 渲染顺序

工作中要对一个表格做再次更新, 可能是渲染后更新或者部分组件渲染之后, 对页面效果做处理

之前对react的理解, 仅仅停留在render渲染.

这次好好理解了下react的生命周期

1 react组件有三种状态 Mounted(已插入真实的DOM) Updating(正在被渲染) 和 Unmounted已移除真实DOM

2 每个状态有两种处理方法 will(进入状态之前调用) 和 did(进入状态之后调用)

3 三种状态总共有5种处理方法, componentWillMount(插入真实DOM之前调用)  componentDidMount(插入真实DOM之后调用)  componentWillUpdate(被渲染之前调用) componentDidUpdate(渲染之后调用) 和 componentWillUnmount(移除之前调用)

4 当然还有组件初始方法: getDefaultProps(获取默认属性) 和 getInitialState(获取初始状态),

5 还有两种特殊方法: componentWillReceiveProps(object nextProps)(已加载的组件收到新的参数时调用) 和 shouldComponentUpdate(object nextProps, object nextState)(判断组件是否需要重新渲染时调用)

生命周期

1 当一个组件被调用的时候, 会先调用改组件的初始方法getDefaultProps和getInitialState,

2 然后执行componentWillMount(即将渲染)

3 进行渲染到DOM上, 渲染完成之后触发componentDidMount(渲染完成)方法

当props发生变化的时候

1.1 先触发componentWillReceiveProps,

1.2 然后利用shouldComponentUpdate判断是否需要重新渲染

1.3 如果不需