停止濫用 React Context API

前幾天我調到新部門了。我的新同事給了我一個重構現有 React 專案的任務。

當我閱讀程式碼時，我被Context API的使用方式震驚了。先前的編碼員將所有內容（是的，幾乎所有內容）放入 Context 物件中，將其視為管理所有狀態甚至某些本地臨時狀態的儲存。太瘋狂了！

他也在一個 .ts 檔案中的一個（是的，絕對只有一個）元件中編寫了頁面的所有內容。我很難在腦海中弄清楚程式碼的邏輯。但我仍然接受這些狗屎代碼（我別無選擇），所以我做出一個重大決定：我將用 Mobx 在一周內重寫所有這些頁面，並將程式碼拆分為不同的功能組件。

透過 Mobx，我創建了多個儲存來處理來自 API 的所有數據，並將一個巨大的元件拆分為不同的小塊；一切開始變得清晰和簡單。本地狀態應該在它要使用的範圍內，公共部分將從 Mobx 的儲存中取得。

終於徹底刪除了 Context 對象，刪除了數千行程式碼，世界又安靜了！

我想說一些關於 Context API 的事情。如果你確實有一些東西，例如一些全域配置資訊要共享給整個應用程序，你可以使用 Context API，但如果你只是想避免使用一些第三方狀態管理庫，那麼將上下文視為一個壞主意替代品。

讓 Context 成為 Context，讓狀態由像 Mobx 這樣的函式庫來管理。

請停止濫用 React Context API！

以上是停止濫用 React Context API的詳細內容。更多資訊請關注PHP中文網其他相關文章！