reactjs - XState 和定期服务调用

Question

在我的 React.js 应用程序中，我想使用 XState 框架来解决以下问题：在特定状态下，我需要定期（间隔 1 秒）获取数据并检查是否可以启动转换。我已经测试了这个构造：

// We are waiting for PIN
pinentering: {
    on: {
        // tick event
        TICK: {
            actions: [
                assign({
                    pinSpawn: () => {
                        return spawn({
                            invoke: {
                                id: 'idPinEntering',
                                // Fetch data
                                src: (context, event) => context.tokenService.getSessionStatus(context.sessionId),
                                onDone: [
                                    {
                                        target: 'insertion',
                                        cond: 'readerIsEmpty',
                                        actions: ['storeSessionStatus']
                                    },
                                    {
                                        target: 'busy',
                                        cond: 'readerIsBusy',
                                        actions: ['storeSessionStatus']
                                    }
                                ],
                            }
                        })
                    }
                        
                })
            ]
        }
    },
    // Actions after state entering
    entry: ['onEntryPining']
},
cardempty: ...

如果收到 TICK 事件，则会出现此错误：无法生成“object”类型的实体“1”。我的问题是：如何正确地定期调用服务？

十分感谢，

米拉

Answer 1

语法不正确；invoke是状态配置的属性。您还可以使用after指定 1 秒后重新进入相​​同状态的外部转换。

pinEntering: {
  invoke: {
    id: 'idPinEntering',
    // ...
  },
  after: {
    1000: {
      target: 'pinEntering',
      internal: false // exit and re-enter
    }
  }
}