---
# System prepended metadata

title: Life Cycle
tags: [React, useEffect, 待補充]

---

# Life Cycle
###### tags: `待補充` `React`
> 以下情境只適用 class component

![](https://i.imgur.com/3Myiz4s.png)

![](https://i.imgur.com/q4Lxk7p.png)
> 一般而言 Component 有以下三種生命週期的狀態：
- `Mounting`：已插入真實的 DOM
- `Updating`：正在被重新渲染
- `Unmounting`：已移出真實的 DOM

針對 Component 的生命週期狀態 React 也有提供對應的處理方法：
#### Mounting
- componentWillMount()
- componentDidMount()
#### Updating
- componentWillReceiveProps(object nextProps)：已載入元件收到新的參數時呼叫
- shouldComponentUpdate(object nextProps, object nextState)：元件判斷是否重新渲染時呼叫，起始不會呼叫除非呼叫 forceUpdate()
- componentWillUpdate(object nextProps, object nextState)
- componentDidUpdate(object prevProps, object prevState)
#### Unmounting
- componentWillUnmount()

## useEffect
###### tags: `useEffect`
