市住房城乡建设部网站海阳seo排名优化培训

React 组件的生命周期可分为三大阶段：挂载阶段（Mounting）、更新阶段（Updating）和卸载阶段（Unmounting）。

        1.挂载阶段（Mounting）

在组件被插入到 DOM 中后，会触发以下生命周期方法：

• constructor(props): 构造函数，最先被执行，在这里设置初始状态以及绑定实例方法。
• componentWillMount(): 组件即将被插入到 DOM 中。
• render(): 返回实际的 JSX 元素。
• componentDidMount(): 组件被插入到 DOM 中后立即执行。

        2.更新阶段（Updating）

当组件的 props 或 state 发生变化时，会触发以下生命周期方法：

• componentWillReceiveProps(nextProps): 当一个挂载的组件接收到新的 props 之前被调用。
• shouldComponentUpdate(nextProps, nextState): 返回一个布尔值，用于比较新旧 props 或 state，以此来决定是否重新渲染组件。
• componentWillUpdate(nextProps, nextState): 如果 shouldComponentUpdate 返回 true，componentWillUpdate 会被调用。
• render()
• componentDidUpdate(prevProps, prevState): 组件更新完成后被执行。

        3.卸载阶段（Unmounting）

当组件从 DOM 中被移除时，会触发以下生命周期方法：

• componentWillUnmount(): 组件即将被移除时执行，通常在这里执行必要的清理工作，如无效定时器，取消网络请求等。

值得注意的是，componentWillMount、componentWillReceiveProps、componentWillUpdate、componentWillUnmount 这四个生命周期方法在 React 的新版本中已被废弃，建议使用新的生命周期方法：getDerivedStateFromProps、shouldComponentUpdate、render 和 getSnapshotBeforeUpdate、componentDidUpdate 和 componentDidMount、componentDidCatch 和 useEffect。