框架
版本

网络模式

TanStack Query 提供了三种不同的网络模式来区分在没有网络连接的情况下查询变更的行为。此模式可以为每个查询/变更单独设置,也可以通过查询/变更默认值全局设置。

由于 TanStack Query 最常用于数据获取并与数据获取库结合使用,因此默认网络模式为在线

网络模式:在线

在此模式下,除非您有网络连接,否则查询和变更不会触发。这是默认模式。如果为查询启动了获取,则如果由于没有网络连接而无法进行获取,它将始终保持其当前 statependingerrorsuccess)。但是,还会额外公开一个 fetchStatus。这可以是:

  • fetchingqueryFn 确实正在执行——请求正在进行中。
  • paused:查询未执行——它已 paused,直到您再次连接。
  • idle:查询目前未执行任何操作。

标志 isFetchingisPaused 是从此状态派生的,并为方便起见而公开。

请记住,检查 pending 状态可能不足以显示加载微调器。如果查询首次挂载并且您没有网络连接,则查询可能处于 state: 'pending',但 fetchStatus: 'paused'

如果查询因为您在线而运行,但在获取仍在进行时您离线,TanStack Query 也会暂停重试机制。暂停的查询将在您重新获得网络连接后继续运行。这与 refetchOnReconnect(在此模式下也默认为 true)无关,因为它不是 refetch,而是 continue。如果在此期间查询已被取消,则它不会继续。

网络模式:始终

在此模式下,TanStack Query 将始终获取并忽略在线/离线状态。如果您在不需要活动网络连接即可使查询工作的环境中使用 TanStack Query(例如,如果您只是从 AsyncStorage 读取,或者如果您只想从 queryFn 返回 Promise.resolve(5)),则这可能是您想要选择的模式。

  • 查询永远不会因为您没有网络连接而处于 paused 状态。
  • 重试也不会暂停——如果查询失败,它将进入 error 状态。
  • 在此模式下,refetchOnReconnect 默认为 false,因为重新连接到网络不再是过时查询应重新获取的良好指标。如果您愿意,仍然可以将其打开。

网络模式:离线优先

此模式是前两种选项之间的折衷方案,其中 TanStack Query 将运行一次 queryFn,但随后会暂停重试。如果您有一个服务工作线程拦截请求以进行缓存(例如在离线优先 PWA 中),或者如果您通过 Cache-Control 标头使用 HTTP 缓存,则此模式非常方便。

在这些情况下,第一次获取可能会成功,因为它来自离线存储/缓存。但是,如果发生缓存未命中,则网络请求将发出并失败,在这种情况下,此模式的行为类似于 online 查询——暂停重试。

开发者工具

如果查询正在获取但没有网络连接,TanStack Query 开发者工具会将查询显示为 paused 状态。还有一个切换按钮可以_模拟离线行为_。请注意,此按钮_不会_实际干扰您的网络连接(您可以在浏览器开发者工具中执行此操作),但它会将 OnlineManager 设置为离线状态。

签名

  • networkMode: 'online' | 'always' | 'offlineFirst'
    • 可选
    • 默认为 'online'