本文目录导航：
什么是react生命周期和生命周期钩子函数？
1. React生命周期指的是React组件从创立到销毁的环节，这个环节大抵可以分为三个阶段：挂载（Mounting）、降级（Updating）和卸载（Unmounting）。
2. 生命周期钩子函数是React组件在特定时辰触发的一些方法。
以下是三个罕用的生命周期钩子函数的便捷引见： - `componentWillMount`: 在组件挂载之前被调用，此时组件还没有生成实践的DOM，处于虚构DOM的形态。
在这个阶段可以启动一些数据解决，比如查问或预备页面渲染所需的数据。
- `componentDidMount`: 在组件挂载成功之后被调用，此时页面曾经生成实践的DOM。
可以在这个阶段操作页面上的DOM元素，例如经过``失掉DOM对象，或许加载如echarts图表等。
- `componentWillUnmount`: 在组件行将被卸载之前调用。
在这个方法中可以口头一些清算上班，例如肃清定时器或解绑事情监听器。
react 父子组件口头顺序
一、组件口头的生命周期：参考或（含生命周期函数 传出去的参数） 1、初始没有扭转state、props 的生命周期： constructor、componentWillMount、render 、【子组件对应这4个周期函数】、componentDidMount依次口头 2、扭转 state 后的生命周期： a、父组件的 state 扭转： shouldComponentUpdate、componentWillUpdate、render、【子组件的 componentWillReceiveProps、子组件对应父组件这4个周期函数】、componentDidUpdate 父组件的的state扭转，会惹起子组件 state 关系的生命周期函数运转。
b、子组件的 state 扭转： shouldComponentUpdate、componentWillUpdate、render、componentDidUpdate 子组件的state扭转，不会惹起父组件的变动。
3、扭转 props 后的 生命周期：【props扭转，不会惹起父子组件的任何变动，state变动才惹起子组件的变动】 父组件传递给子组件的props扭转，不会惹起任何变动。
只要父组件state扭转，父组件render函数运转，一切子组件递归降级。
所以父组件传递给子组件的props值，普通经常使用state的值，不然给子组件的props值扭转了，然而没有方法传递到子组件中，得等触发了父组件的render函数，能力把数据传递给子组件。
父组件的 state 设置，都会触发子组件的 componentWillReceiveProps 生命周期函数，且把函数参数是props值。
了解React：Fiber架构和新旧生命周期
React16.3之后React的 Reconciler 架构被重写(Reconciler用于解决生命周期钩子函数和DOM DIFF)，之前版本驳回函数调用栈递归同步渲染机制即Stack Reconciler，dom的diff阶段不能被打断，所以不利于动画口头和事情照应。
React团队经常使用Fiber Reconciler架构之后，diff阶段依据虚构DOM节点拆分红蕴含多个上班义务单元(FiberNode)的Fiber树(以链表成功)，成功了Fiber义务单元之间的恣意切换和义务之间的打断及复原等等。
Fiber架构下的异步渲染造成了 componentWillMount 、 componentWillReceiveProps 、 componentWillUpdate 三个生命周期在实践渲染之前或许会被调用屡次，发生无法预料的调用结果，因此这三个不安保生命周期函数不倡导被经常使用。
取而代之的是经常使用全新的两个生命周期函数： getDerivedStateFromProps 和 getSnapshotBeforeUpdate 。
或许造成的bug：在须要重置SimpleInput组件的状况下，因为 未扭转，造成组件无法正确重置形态，体现就是input输入框组件的值还是上次遗留的输入。
