對標 useState 主要使用差異在於 useRef 創建出來的變數在被更動時並不會觸發 re-render

而 useState 在使用 setState 更動變數時則會觸發

useRef 屬於 side effect 特性，不主動 call re-render 的情況下，視圖不會更新

Ref 內結構為 Object, default key 為 current

useRef 常用的範例通常是為了紀錄 render 次數，或是預存 useState 改動前的資料狀態

推估使用方向:

在網站內植入 user 點擊熱區、scrollbar event 等等監控使用者互動狀態的暫存值都可以使用到 useRef

How to set up performance and user tracking in React with Google Analytics

Child Component 使用率等等

[React Hook 筆記] useRef

或植入 ref 至 HTML Tag 內直接操作 DOM （如附圖)

在沒有使用 mui 或其他 custom components 時，可以用這種方式來實現 onFocus 的功能

也可以用來整合第三方 DOM 套件 （ 尚未找到範例和使用情境）

也可以在不重新渲染下集成使用者操作資料，當使用者點擊事件按鈕後再一次將統合完的值傳入執行函式