angular - 如何设置 Xstate 以在 Angular 中使用 Redux Dev Tool
问题描述
我在 Angular 项目中使用 xstate 进行状态管理。我做了
this.service = interpret(machine, { devTools: true }).start();
启动我的机器时,但 redux 开发工具没有从我的项目中获取任何事件。除了添加 redux 扩展外,是否需要任何其他设置。
解决方案
Redux devtools 不适用于 xstate。但他们提供了一个很棒的包:
npm i @xstate/inspect
或者
yarn add @xstate/inspect
在您的代码中,无论您在哪里解释机器:
// add this statement before interpreting
inspect({ iframe: false });
const machine = Machine<DefaultContext, StateSchema, EventObject>(machineConfig as MachineConfig<DefaultContext, StateSchema, EventObject>).withConfig(machineOptions);
const interpreter = interpret(machine, { devTools: true}).start();
这将自动启动 XState Inspector 并在执行时向您显示转换,前提是您正确编写了机器代码的其余部分。
推荐阅读
- apache-kafka - 在数据库和 Kafka 生产者之间同步事务
- excel - 用于 excel 的 Google API 距离矩阵宏工具
- google-slides - 如何在 Google 幻灯片中创建动态网址?
- couchdb - CouchDB 过滤功能和连续馈送
- flutter - 如何在 Flutter 中使用 divideTiles()?
- c++ - 如何检测一个类是否有成员变量?
- angular - 在多列中动态显示角度 6 材质单选按钮
- python - 使用pyenv时,不同版本的python能否共享相同的第三方库,如numpy 1.15.1和jupyter 1.0.1?
- java - jhipster 应用程序中 application-prod.yml 和 application-dev.yml 之间的区别
- sql - 如何用 * 标记薪水最高的员工?- SQL 服务器