Generated by XState Viz: https://xstate.js.org/viz

machine.js

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions
  // - XState (all XState exports)
  
  let lionMachine = Machine(
  {
    id: 'lion',
    initial: 'idle',
    context: {
      displayIndex: 0 // 龙骨、背景图展示第几套
    },
    states: {
      idle: {
        on: {
          CLICK: 'jiaohu',
          UP_CLICK: 'preUpgrade'
        },
        entry: 'play'
      },
      jiaohu: {
        type: 'parallel',
        states: {
          animation: {
            initial: 'playing',
            states: {
              playing: {
                on: {
                  LOOP_END_hudong: [
                    {
                      target: '#lion.idle',
                      in: '#lion.jiaohu.rpc.end'
                    },
                    { target: 'playing' }
                  ]
                },
                entry: 'play'
              }
            }
          },
          rpc: {
            initial: 'init',
            states: {
              init: {
                invoke: {
                  src: 'poke',
                  onDone: 'end',
                  onError: 'end'
                }
              },
              end: {
                type: 'final'
              }
            }
          }
        }
      },
      preUpgrade: {
        invoke: {
          src: 'fetchUpgrade',
          onDone: {
            target: 'upgrade',
            actions: assign((context, event) => ({
              displayIndex: event.data.displayIndex
            }))
          },
          onError: 'idle'
        }
      },
      upgrade: {
        on: {
          END: 'idle'
        },
        entry: 'play'
      }
    }
  },
  {}
)