在 React 組件外部更新 redux state

Question

我有一個配置了 redux 的反應項目，用於 state 管理。 對於 api 調用，我使用一個名為 axiosInstance 的文件。 在這個文件中，我需要訪問 redux 存儲（並且我可以訪問導入存儲並使用 getState - store.getState()）。 現在的問題是我還想從這個文件（axiosInstance）更新 redux state。 如何以有效的方法從此文件（不是反應組件）更新 redux 存儲？

Answer 1

好的，我假設您使用 Axios 進行網絡調用。

tl;博士

使用store.dispatch(action)和 action 進行更改以存儲 state

是的，可以使用store.getState()訪問商店，您也可以使用store.dispatch(action)更改 state。 根據文檔

調度一個動作。 這是觸發 state 更改的唯一方法。

商店的減少 function 將與當前的 getState() 結果和給定的動作同步調用。 其返回值將被視為下一個 state。 從現在開始，它會從 getState() 中返回，並且會立即通知更改監聽器。

這是因為 redux 遵循的功能范例（谷歌了解更多）。

現在，必須使用actionCreator定義操作，或者您可以簡單地調用 .dispatch .dispatch()並使用內聯 object ，其中一個字符串屬性為{type: 'name-of-action'} 。 這會提示商店更改 state。 您可能需要 redux-thunk 來執行異步操作。

結論：

讓我們在這里省點麻煩，因為您可能對存儲有很多調用，您可以創建一個處理 AxiosInstance 的上下文（因為已經有一個不同的文件）。

在 AxiosInstance 文件中創建一個上下文，然后您可以根據網絡響應開始調度操作。 這將為您省去很多麻煩，因為 state 是由 redux 更新的，而實際上並沒有看太多。