React Recoil 状态未正确重置答案

【问题标题】：React Recoil state not being reset properlyReact Recoil 状态未正确重置
【发布时间】：2020-08-11 19:31:50
【问题描述】：

我有一些反冲状态，我想重置。

import { useRecoilValue, useResetRecoilState, useSetRecoilState } from 'recoil';
...
  //should be used for flushing the global recoil state, whenever a user submits an invoice
  const resetLabelInvoiceState = useResetRecoilState(labelInvoiceState);
  const resetMetaDataState = useResetRecoilState(metadataState);
  const resetGlobalAnnotationsState = useResetRecoilState(globalAnnotationState)

我已经做了功能，我想像这样重置所有状态。有无重置功能我都试过了。

const flushRecoilState = () =>{
     console.log('flushed state')
     return(
    resetLabelInvoiceState(),
    resetMetaDataState(),
    resetGlobalAnnotationsState()
     )
   }

...
        flushRecoilState()
        return history.push('/historyinvoices')
...

当我检查状态时，它没有被重置。是因为库中的“useResetRecoilState”没有正常工作，没有正确实现，还是有其他问题。

我可以只使用常规的useRecoilState 钩子，然后将状态设置回默认值。

有人知道为什么会这样吗？

【问题讨论】：

你能分享一个最小的 CodeSandbox 来玩吗？ ??????
你为什么要return(resetLabelInvoiceState(), resetMetaDataState(), resetGlobalAnnotationsState())？这没有意义，所有函数都被调用，但只返回第一个函数的结果。更多：如果我没记错的话，useResetRecoilState 什么也不返回？？？？
什么时候检查复位值？这是一个异步操作。调用钩子返回的重置函数不会立即将更改传播到每个订阅的组件。它就像原版 React 中的设置状态一样工作。

标签： javascript reactjs recoiljs

【解决方案1】：

我今天也遇到了同样的问题，原来是我自己的错。把它放在这里以备将来参考。

我的问题是我在选择器中更改了set方法，如果自定义了set方法，需要检查传入的值是否为DefaultValue。

const targetYear = selector({
  key: 'targetYear',
  get: ({get}) => get(targetYearAtom),
  set: ({set, get}, method) => {
    const currentTargetYear = get(targetYearAtom);
    switch(method) {
      case 'prevYear':
        set(targetYearAtom, currentTargetYear - 1);
        return;
      case 'nextYear':
        set(targetYearAtom, currentTargetYear + 1);
        return;
      default:
        if (method instanceof DefaultValue) {
          set(targetYearAtom, method);
        }
        return;
    }
  },
})

【讨论】：