react生命周期钩子函数

render在更新阶段和挂在阶段都会执行

class App extends Component {
    render() {
        return (
            <div>
                <h1>reacet生命周期的周期函数</h1>
                <h2>挂载时 --- 初始化阶段</h2>
                <ul>
                    <li>
                        constructor()
                    <p>
                            如果不初始化state或者不进行方法的绑定，则不需要为react的组建实现构造函数 初始化状态
                    </p>
                    </li>
                    <li>
                        ComponentWillMount()
                    <p>
                            以前会在这里请求数据源 现在不会 即将被废弃 表示组建出现前，dom即将挂载状态
                    </p>
                    </li>
                    <li>
                        render（）
                    <p>
                            表示初次渲染组建的内容
                    </p>
                    </li>
                    <li>
                        ComponentDidMount
                    <p>
                            表示dom已经挂载完毕 可以发动数据请求 可以操作dom
                    </p>
                    </li>
                </ul>
                {
                    //除了挂载阶段，还有一种“更新阶段”。
                    //说白了就是 setState 导致 React.js
                    //重新渲染组件并且把组件的变化应用到 DOM 元素上的过程，
                    //这是一个组件的变化过程。而 React.js
                    // 也提供了一系列的生命周期函数可以让我们在这个组件更新的过程执行一些操作。
                }

           ## 更新时 ---- 运行时的阶段函数
           ```
                <ul>
                <li>
                    ComponentWillReceiveprops(nextprops)
                <p>可以依据nextprops 达到类似vue中事件监听的目的 -- 即将被废弃的钩子函数,
                                组件从父组件接收到新的 props 之前调用 表示更新前还没有接受到props方法之前的状态
                </p>
                </li>
                <li>
                    commponentWillupdata()
                <p>组件获取了props之后开始渲染进dom之前的状态 --即将更新之前 --新版本不用了要废弃</p>
                </li>
                <li>
                    render（）
                <p>组建更新状态</p>
                </li>
                <li>
                    componentDidYpdate()
                <p>组建更新完毕状态，可以经行dom操作</p>
                </li>
                <li>
                    componentwillUmount
                <p>组件销毁 -- 一处定时器 计时器 销毁对象</p>
                </li>
                <li>
                    componentDidcatch
                <p>react组建书出错的时候函数的状态</p>
                </li>
            </ul>
        </div>
    )
}

}

export default App