XState中assign操作未触发、context的output字段无法更新是什么原因？

你代码的问题出在assign的调用位置错误。assign不是可以直接执行修改context的函数，它本质是生成XState可识别的动作描述的工厂函数，必须挂载到状态机的actions字段，由XState内部调度执行才会生效，你直接在异步回调里调用assign不会产生任何效果。

你可以按照如下步骤调整代码：

1. 在invoke的异步回调中，将请求获取到的data.title作为参数，随FETCHED_SUCCESSFULLY事件一同发送
2. 在loading状态的FETCHED_SUCCESSFULLY事件转换配置中，新增actions配置项，调用assign接收事件参数更新output字段

修改后的核心代码片段如下：

// 调整后的invoke部分
invoke: {
  src: (context, event) => async (send) => {
    setTimeout(async () => {
      const data = await fetchifetch();
      console.log("done");
      console.log(data);
      // 事件携带返回数据
      send({ type: "FETCHED_SUCCESSFULLY", title: data.title });
    }, 4000);
    console.log("start");
  },
  onError: {
    target: "idle"
  }
},
// 调整后的事件转换部分
on: {
  FETCHED_SUCCESSFULLY: {
    target: "idle",
    // 执行assign更新context
    actions: assign({
      output: (_, event) => event.title
    })
  }
}

调整后即可正常更新context中的output字段。

内容的提问来源于stack exchange，提问作者aloisdg