xstate - 如何从 xstate 中的状态获取所有可能的转换

Question

给定一个 xState fsm，例如计数器或搜索示例。

如何枚举可能的转换？我试过了

const current = service.state
const stateNode = service.machine
const isActive = !stateNode.parent || current.matches(stateNode.path.join('.')) || undefined
getEdges(<where do I get this node?>, { depth: 0 }).reduce((actions, edge) 

问题是我不知道该提交什么getEdges作为第一个论点。当 fsm 刚开始时，上交stateNode不会产生任何边。但是，xState VIZ 应用程序清楚地显示活动状态具有转换。

Answer 1

我已经玩过部分内容@xstate/graph，这个例子与我想要的一样接近：

import { Machine } from "xstate"

import { getShortestPaths } from '@xstate/graph'

export const feedbackMachine = Machine({
    id: 'feedback',
    initial: 'question',
    states: {
        question: {
            on: {
                CLICK_GOOD: 'thanks',
                CLICK_BAD: 'form',
                CLOSE: 'closed',
                ESC: 'closed',
                REMOVE_ME: 'nope'
            }
        },
        form: {
            on: {
                SUBMIT: 'thanks',
                CLOSE: 'closed',
                ESC: 'closed'
            }
        },
        nope: {
            on: {

            }
        },
        thanks: {
            on: {
                CLOSE: 'closed',
                ESC: 'closed'
            }
        },
        closed: {
            type: 'final'
        }
    }
})

const showPaths = () => {
    const paths = getShortestPaths(feedbackMachine)
    const states = Object.keys(paths).filter(k => paths[k].weight > 0)
    console.log(states)
    // [""thanks"", ""form"", ""closed"", ""nope""]
}

showPaths()

从问题状态中的可能转换中删除REMOVE_ME: 'nope'后，您应该看到结果为：[""thanks"", ""form"", ""closed""]showPaths

我还看到 getEdges 最近已被删除，@xstate/graph所以我暂时不要使用它。