當你想讓一個組件“記住”一些信息，但又不想這些信息觸發新的渲染時，你可以使用 ref。
使用 Ref 前，需要導入useRef，代碼如下：
import { useRef } from 'react';
在您的組件內部，調用 useRef 并將您想要引用的初始值作為唯一參數傳遞。例如，這里是對值0的引用：
const ref = useRef(0);您可以通過 ref.current 屬性訪問該 ref 的當前值。這個值是有意可變的，意味著您可以讀取和寫入它。它就像您組件中的一個秘密口袋，React不會跟蹤。
Ref 指向一個數字，但就像 State 一樣，你可以指向任何東西：一個字符串、一個對象，甚至是函數。與 State 不同，Ref 是一個普通的 JavaScript 對象，你可以讀取和修改其當前屬性。
請注意，組件不會在每次增加時重新渲染。像 State 一樣，React 會在重新渲染之間保留 Ref。然而，設置 State 會重新渲染組件。改變 Ref 不會！
Ref 和 State 的區別，見下表：
refs | state |
| useRef(初始值) | useSate(初始值) |
| 當改變時，不會觸發渲染 | 當改變時，會觸發渲染 |
| “可變”——可以在渲染過程之外，修改或改變 | “不可變”——您必須使用狀態設置函數來修改狀態變量以排隊重新渲染。 |
| 在渲染期間，不應該讀取或更新 | 可隨時讀取 |
通常，當您的組件需要與外部API進行通信時，您會使用ref——通常是不會影響組件外觀的瀏覽器API。以下是一些這些罕見的情況：
- 存儲超時ID
- 存儲和操作DOM元素
- 存儲其他不必要用于計算JSX的對象
如果你的組件需要存儲一些值，但不會影響渲染邏輯，請選擇使用 ref。
)
