為什麼在非嚴格模式下使用 useState 進行多次渲染？

在 React 中使用 useState 時，你可能會注意到你的元件渲染不只一次。即使沒有啟用嚴格模式，這種行為也可能出現，需要一些澄清。

點擊「更改編號」按鈕後，由於額外的元件渲染，您將觀察到兩個控制台語句（「此處」）。正如之前所建議的，這背後的原因不是嚴格模式。相反，React 會觸發雙重渲染，以促進更具確定性的開發環境。

根據 React 的文檔，開發中的非嚴格模式會執行以下操作：

• 有意調用元件建構函數，渲染和狀態更新函數兩次。
• 加倍調用函數元件的主體和鉤子，例如 useState。

這種雙重渲染提供了檢測程式碼中潛在副作用的機會，儘早突出顯示效能問題或錯誤。雖然這種額外的渲染不會在生產中發生，但它在開發過程中可以作為有價值的故障排除幫助。