如何将API调用的结果设置为反冲原子的默认值？

Question

我正在尝试将RecoilJS中的原子的默认值设置为异步API调用的值。我这样做的目的是，当某个React组件呈现时，它将拥有数据库中的所有当前集合，而不必调用useEffect()。这是我的代码。

const sets = (async () => await setService.getAll())()

export const setsState = atom({
  key: 'sets',
  default: sets
})

这是我得到的错误...

index.js:1 Warning: Cannot update a component (`Batcher`) while rendering a different component (`App`). To locate the bad setState() call inside `App`, follow the stack trace as described in https://facebook.com/setstate-in-render
    in App (at src/index.js:10)
    in Router (created by BrowserRouter)
    in BrowserRouter (at src/index.js:9)
    in RecoilRoot (at src/index.js:8)

我所采取的方法有没有根本上的错误？我应该用另一种方式来完成这件事吗？我是不是做错了什么，或者这只是反冲的一个损坏的特性？

Answer 1

您可以尝试创建一个异步选择器，并将其放入atom的默认值中，如下所示：

const mySelector = selector({
  key: 'mySelector',
  get: async ({get}) => {
    return await setService.getAll()
  }
})

const myAtom = atom({
  key:'myAtom',
  default: mySelector
})

Answer 2

您报告的警告是known by the Recoil maintainers，它将在下一个版本中修复。

不建议:如果你想暂时隐藏它，你可以将React降级到v16.12.0，这取决于你是否可以忍受这个警告，直到下一个反冲版本?