如何在 xstate 中重用状态转换？答案

【问题标题】：How to reuse state transitions in xstate?如何在 xstate 中重用状态转换？
【发布时间】：2020-03-14 00:09:36
【问题描述】：

取以下有限状态机：

const machine = Machine({
  initial: "foo",
  states: {
    foo: {
      on: {
        BAZ: "baz",
        QUX: "qux",
      },
    },
    bar: {
      on: {
        BAZ: "baz",
        QUX: "qux",
      },
    },
    baz: {
      on: {
        FOO: "foo",
        BAR: "bar",
      },
    },
    qux: {
      on: {
        FOO: "foo",
        BAR: "bar",
      },
    },
  },
});

请注意，有两组重复的状态转换：

on: {
  FOO: "foo",
  bar: "bar",
}

on: {
  BAZ: "baz",
  QUX: "qux",
}

除了将状态转换定义为机器定义之外的优秀 JavaScript 对象之外，是否有一种特殊的方式来做到这一点？

【问题讨论】：

标签： javascript state state-management xstate

【解决方案1】：

除了将状态转换定义为机器定义之外的良好 JavaScript 对象

您回答了自己的问题！您已经知道如何删除这些数据，因此将它们定义为外部对象并在机器内引用它们。不需要特殊的 API 来执行此操作。

【讨论】：

很高兴知道！其他范例（如 GraphQL）有其自定义 API 来鼓励代码库中的 DRY-ness，即 fragments。