舊的生命週期

/* 
                1. 初始化階段: 由ReactDOM.render()觸發---初次渲染
                                    1.    constructor()
                                    2.    componentWillMount()
                                    3.    render()
                                    4.    componentDidMount() =====> 常用
                                                    一般在這個鉤子中做一些初始化的事，例如：開啟定時器、傳送網路請求、訂閱訊息
                2. 更新階段: 由元件內部this.setSate()或父元件render觸發
                                    1.    shouldComponentUpdate()
                                    2.    componentWillUpdate()
                                    3.    render() =====> 必須使用的一個
                                    4.    componentDidUpdate()
                3. 解除安裝元件: 由ReactDOM.unmountComponentAtNode()觸發
                                    1.    componentWillUnmount()  =====> 常用
                                                    一般在這個鉤子中做一些收尾的事，例如：關閉定時器、取消訂閱訊息
        
 
*/

 新生命週期

/* 
                1. 初始化階段: 由ReactDOM.render()觸發---初次渲染
                                1.    constructor()
                                2.    getDerivedStateFromProps 
                                3.    render()
                                4.    componentDidMount() =====> 常用
                                            一般在這個鉤子中做一些初始化的事，例如：開啟定時器、傳送網路請求、訂閱訊息
                2. 更新階段: 由元件內部this.setSate()或父元件重新render觸發
                                1.    getDerivedStateFromProps
                                2.    shouldComponentUpdate()
                                3.    render()
                                4.    getSnapshotBeforeUpdate
                                5.    componentDidUpdate()
                3. 解除安裝元件: 由ReactDOM.unmountComponentAtNode()觸發
                                1.    componentWillUnmount()  =====> 常用
                                            一般在這個鉤子中做一些收尾的事，例如：關閉定時器、取消訂閱訊息
            
 
*/