译零 TransZero · TanStack Query v3 中文文档
主站

禁用/暂停查询 disabling-queries

如果要禁用自动运行的查询,则可以使用enabled = false选项。

当 enabled 是 false时:

  • 如果查询已缓存了数据
    • 查询将以status === 'success'或isSuccess的状态进行初始化。
  • 如果查询没有缓存的数据
    • 查询将以status === 'idle'或isIdle的状态进行初始化。
  • 该查询将不会在挂载时自动获取数据
  • 当挂载新实例或出现新实例时,查询不会自动在后台重新获取数据
  • 该查询将忽略查询客户端的invalidateQueries和refetchQueries调用,这些调用通常会导致查询重新获取数据
  • refetch可用于手动触发查询以进行数据获取。
JavaScript
1function Todos() {2  const { isIdle, isLoading, isError, data, error, refetch, isFetching } =3    useQuery("todos", fetchTodoList, {4      enabled: false,5    });6 7  return (8    <>9      <button onClick={() => refetch()}>Fetch Todos</button>1011      {isIdle ? (12        "Not ready..."13      ) : isLoading ? (14        <span>Loading...</span>15      ) : isError ? (16        <span>Error: {error.message}</span>17      ) : (18        <>19          <ul>20            {data.map((todo) => (21              <li key={todo.id}>{todo.title}</li>22            ))}23          </ul>24          <div>{isFetching ? "Fetching..." : null}</div>25        </>26      )}27    </>28  );29}