useRevalidator

useRevalidator

摘要

参考文档 ↗

由于正常数据突变之外的原因(如Window 焦点或按时间间隔轮询),重新验证页面上的数据。

请注意,页面数据在操作后已经自动重新验证。如果您发现自己为了响应用户交互而对数据进行正常的 CRUD 操作而使用此功能,那么您可能没有利用其他 API,如useFetcherFormuseSubmit,这些 API 会自动执行此操作。

import { useRevalidator } from "react-router";

function WindowFocusRevalidator() {
  const revalidator = useRevalidator();

  useFakeWindowFocus(() => {
    revalidator.revalidate();
  });

  return (
    <div hidden={revalidator.state === "idle"}>
      Revalidating...
    </div>
  );
}

签名

function useRevalidator(): {
  revalidate: () => Promise<void>;
  state: DataRouter["state"]["revalidation"];
}

返回

一个包含 revalidate 函数和当前重新验证 state 的对象。

文档和示例 CC 4.0
编辑