Question

我在文件task_statemachine.js中对XState FMS的定义如下：

module.exports = {
  id: 'runner',
  initial: 'setup',
  states: {
    setup: {
      on: {
        RECEIVED: {
          target: 'running',
          actions: 'runTask',
        },

        ERROR: {
          target: 'error',
          actions: 'taskError',
        },

        TERMINATED: {
          target: 'terminated',
          actions: 'terminate',
        },
      },
    },

    running: {
      on: {
        COMPLETE: {
          target: 'complete',
          actions: 'taskComplete',
        },

        ERROR: {
          target: 'error',
          actions: 'taskError',
        },

        TERMINATED: {
          target: 'terminated',
          actions: 'terminate',
        },
      },
    },

    terminated: {
      type: 'final',
    },

    complete: {
      type: 'final',
    },

    error: {
      type: 'final',
    },
  },
}

实际的机器本身和服务是在TASK()类的构造函数中创建的，如下所示：

if (!this.state) this.state = interpret(Machine(require('./task_statemachine'), {
      actions: {
        runTask: this.runTask,
        taskComplete: this.taskComplete,
        taskError: this.taskError,
        terminate: this.terminate
      }
    })).start();

尝试运行应该调用该类中定义的函数的操作时遇到问题。我通过以下方式发送事件this.state.send('COMPLETE');

如果我将actions定义为回调数组，则像runTask: this.runTask()这样的动作似乎按其应有的方式运行。据我的同事们说，这样做是不好的做法。加载类后调用动作的正确方法是什么？

Answer 1

此问题是由this绑定引起的。解决方案是将函数回调函数转换为actions数组中的箭头函数。

if (!this.state) this.state = interpret(Machine(require('./task_statemachine'), {
      actions: {
        // High Level Functions
        runTask: () => {
          this.runTask()
        },
        taskComplete: () => {
          this.taskComplete()
        },
        taskError: () => {
          this.taskError()
        },
        terminate: () => {
          this.terminate()
        }

        // runTask() Functions
      }
    })).start();

在XState FMS中调用动作的正确方法是什么？

1 个答案: