问题标签 [xstate]

我创建了这个代码框来突出问题。

我为反应钩子可中止提取创建了一个状态机。

我可以让它工作的唯一方法是让所有状态都处于同一级别：

但对我来说，嵌套这样的状态更有意义：

加载有子状态，但如果我这样做，我会收到以下错误消息：

状态节点“fetchable.loading”的无效转换定义：“fetchable”上不存在子状态“succeeded”

嗨，我正在尝试修复的组件有一个小打字问题：

在 <Backdrop className={state.value} onClick={handleBackdropClick}>我得到：

状态机库StateValue中的类型import { StateValue } from 'xstate'在哪里。xstate

类名用于在样式之间切换：

我该如何解决这个打字错误？嗨，我正在尝试修复的组件有一个小打字问题：

在 <Backdrop className={state.value} onClick={handleBackdropClick}>我得到：

状态机库StateValue中的类型import { StateValue } from 'xstate'在哪里。xstate

类名用于在样式之间切换：

如果我确实console.log得到state.value字符串：

键入StateValue和StateValueMap

我该如何解决这个打字错误？

我有一个工作车状态机可以在我使用 reactjs 的购物车中添加项目。在刷新页面上，上下文没有被保留。我是状态机的新手，想在我的应用程序中保留状态。下面是我的 cartMachine。请帮助。谢谢。

我试图在用户单击时更改按钮的状态，它都是 xstate 的一部分，按钮正在获取，根据状态按钮将要工作。在打字稿中，它工作正常，但在反应钩子中没有

我得到的状态是未定义的，但是当我重新加载按钮时，值正在更新

这是我得到的错误。

有什么我遗漏的，请纠正，我还需要什么

我正在尝试使用状态机实现多步骤向导，但不确定如何处理某些配置。为了说明这一点，我整理了一个帮助您准备菜肴的向导示例。假设以下示例将此表单/向导行为建模为状态机的适当方法是什么？

第 1 步 - 盘子

• 从 ["Salad", "Pasta", "Pizza"] 中选择一道菜

第 2 步 - 制备方法

• 从 ["Oven", "Microwave"] 中选择一种制备方法

第 3 步 - 成分

• 在表格中添加和选择成分，根据菜肴和制备方法，表格看起来会有所不同

我试图尽可能地简化问题。以下是我的问题：

1. 在第 3 步中，我想显示一个包含不同类型的各种字段的表单。第 1 步和第 2 步中的选择定义了哪些字段将显示在第 3 步的表单中。指定此表单配置的适当方法是什么？

2. 如果第 1 步选择的菜是“沙拉”，则应跳过第 2 步。声明这一点的适当方法是什么？

我计划使用xstate来实现这一点，因为我正在处理的项目是用 react 编写的。

编辑：我更新了示例以响应马丁斯的回答。（见我对他的回答的评论）

编辑 2：我更新了示例以响应 Davids 的回答。（见我对他的回答的评论）

假设我有一台具有单一状态的机器，它提供动作递增或递减一个值。

是否可以在执行任何其他操作之后initial以某种方式在该映射中指定一个操作？作为一个例子，我可能希望每次都乘以and的结果。context incdec

我意识到我可以在两者之后添加一个动作inc，dec但如果这在一个地方以某种方式可行，我很感兴趣。

在考虑工作流的视觉表达时，有向图可能是首先想到的解决方案之一。

我的应用程序已经利用了 ECharts，所以我也想用它来为我的工作流程生成图表。

以下是嵌套定向工作流的基本示例：

ECharts 中有没有可以作为容器使用的组件？并链接到/从（类似于red上图中的“容器”？

更新：在 ECharts Github repo 上创建了一个问题，以帮助推动这一进程。两个 ECharts Series 之间的链接也应该对这个用例有用。

我是 xState 的新手，想将现有的应用程序从 redux 迁移到 xState（我的主要动机是完全摆脱应用程序中的 redux 代码）这样​​做我已经关注了一些链接但停留在导航部分。让我解释一下，我试图通过以下场景通过 xState 实现：我的代码homeScreen.js、searchResult.js和myMachine.js中有三个文件，其中包含状态逻辑。主屏幕包含一些输入字段和一个搜索按钮，当用户点击搜索按钮时，它将调用 API，如果成功获取结果，则在结果屏幕上导航并将结果传递到结果屏幕。

myMachine.js // 包含机器逻辑

2. 主屏幕 /index.js

3.searchResult.js

在上面的代码中，我还有一些疑问，如下所示：

1. 我需要为每个屏幕创建单独的机器吗？
2. 如果答案是肯定的，那么我如何管理每个屏幕的单个机器？
3. 如果没有，我如何创建一个机器实例（它不会将机器重置为其初始状态值），我可以与每个屏幕共享或使用它，并保持/保持状态的最后转换和存储的上下文值？
4. 如何使用 xState 管理屏幕导航？

注意：要做到这一点，我已经点击了这个不起作用的链接https://codesandbox.io/s/ykmykxnm3z。

提前致谢。

我有组件 A 和组件 B，在组件 A 中进行一些选择后，组件 B 应该能够获得更新状态或选择。我已经分别为 MachineA 和 MachineB 分配了单独的机器。我想知道如何在组件 B 中获取 MachineB 的上下文，该上下文在组件 A 中得到更新。

例如：组件 A 从机器 A 获取数据并使用所选产品更新机器 B 的上下文。现在组件 B 应该能够访问已更新的机器 B 的存储。知道怎么做吗？我不想将状态作为道具传递。

我有一个使用 xstate 的反应应用程序，并且有很多变量和服务，每次我想将它显示给可视化器时，我都必须删除这些变量。有没有办法将 xstate 可视化器链接到我的应用程序？就像我的应用程序运行时一样，它也会反映在状态可视化器中。谢谢