整合刷新与默认值

可刷新 atom 通常被用来实现内容的异步加载,这种操作在网络中断等情况出现的时候,常常无法获取应有的结果,所以这时为可刷新 atom 提供一个回退的默认值就非常有用了。

一下提供一个根据可刷新 atom 创建带默认值的 atom 的函数。

const atomWithRefreshAndDefault = (refreshAtom, getDefault) => {
  const overwrittenAtom = atom(null);
  return atom(
    (get) => {
      const lastState = get(overwrittenAtom);
      if (lastState && lastState.refresh === get(refreshAtom)) {
        return lastState.value;
      }
      return getDefault(get);
    },
    (get, set, update) => {
      set(overwrittenAtom, { refresh: get(refreshAtom), value: update });
    }
  );
};

这个 atom 创建函数的使用需要借助于另外的一个可刷新 atom 和一个原始 atom。其使用方法如下所示。

const baseAtom = atom(1);
const refreshCountAtom = atom(0);
const dataAtom = atom(
  (get) => {
    get(refreshCountAtom);
    return get(baseAtom);
  },
  (get, set, update) => {
    set(baseAtom, update);
  }
);

const refreshableAtom = atomWithRefreshAndDefault(
  refreshCountAtom,
  (get) => get(dataAtom) * 2
);