Redux Toolkit - 如何在切片之间共享操作

Question

我正在使用 Redux Toolkit，并且有三个组件，每个组件都有一个切片：A、B、C。

我需要组件 A 来调度一个动作，组件 B 和 C 来响应它。 如何实现所有组件不相互依赖，类似于发布/订阅模式？

Answer 1

首先，在对动作做出反应的组件 B 和 C 中添加extraReducers。

但是，您可能会遇到 the circular reference problem. 中的一个组件引用另一个组件的风险，反之亦然。

作者mentions a solution on github 我曾经使用过。即，将共享的 reducer 分离到一个单独的文件中。我的实现如下：

• featureA/byId/actions.js 包含定义的操作 使用 createAction。
• featureB/byId/actions.js 包含使用 createAction 定义的操作。

每个 createAction 都是类似于以下的操作：

const createTodo = createAction("todos/createTodo");

• featureA/byId/reducer.js 从上面的两个 action.js 文件中导入其 extraReducer-actions。
• featureB/byId/reducer.js 从上面的两个 action.js 文件中导入其 extraReducer-actions。

结果：在多个 reducer 中使用的操作没有循环引用问题。