如何将操作发送到 redux-devtools 存储以从组件导入状态？

Posted 2023-02-19

【中文标题】如何将操作发送到 redux-devtools 存储以从组件导入状态？

【英文标题】：How to dispatch an action to the redux-devtools store for importing a state from a component?

【发布时间】：2020-01-06 06:11:57

【问题描述】：

我目前正在尝试实现一个集成在我的 Angular 应用程序中的面板，它允许我使用与 redux-devtools 相同的导入功能导入从 redux-devtools 导出的任何 json 状态文件。

我的应用程序与@ngrx/store-devtools 正确集成。

我不知道如何从我的组件中检索 devtools 存储，然后像我在 redux-devtools 代码中看到的那样调度操作 IMPORT_STATE：

store.liftedStore.dispatch(type: 'IMPORT_STATE', ...nextLiftedState);

目标是从 redux-devtools 手动触发导入状态功能，但直接在我的应用程序的组件中。

有可能做到吗？以及如何将这个 store 注入到我的组件中然后使用它？

提前致谢，

编辑：

实际上，我想要实现的是在我的应用程序中拥有一个组件，它允许我导入以前从 redux-devtools 扩展程序记录的不同状态（作为 json 文件）以访问我的应用程序的任何页面.因此，该组件需要访问 redux-devtools 存储并调度操作 IMPORT_STATE。我目前所做的似乎没有触发 redux-devtools 商店的 IMPORT_STATE 操作的减速器。我想我遗漏了一些东西来包含 Angular 应用程序中的 redux-devtools 存储。

您知道如何实现这一目标吗？

提前致谢，

【参考方案1】：

要从 redux devtools 中的 dispatcher 分派到 store，您只需在 action 定义中输入 json，然后单击 dispatch。

例如：

type: 'IMPORT_STATE',
... whatever payload contents you need here ...

要打开调度程序，请单击开发工具底部中间的小键盘按钮。