broadcastQueryClient (实验性)

非常重要：此实用程序目前处于实验阶段。这意味着在次要版本和补丁版本中都会发生重大更改。请谨慎使用。如果您选择在实验阶段在生产环境中使用此功能，请将您的版本锁定到补丁级别版本，以避免意外损坏。

broadcastQueryClient 是一个实用程序，用于在具有相同来源的浏览器选项卡/窗口之间广播和同步 queryClient 的状态。

安装

此实用程序作为一个单独的包提供，可通过 '@tanstack/query-broadcast-client-experimental' 导入。

用法

导入 broadcastQueryClient 函数，并向其传递您的 QueryClient 实例，以及可选地设置一个 broadcastChannel。

tsx

import { broadcastQueryClient } from '@tanstack/query-broadcast-client-experimental'

const queryClient = new QueryClient()

broadcastQueryClient({
  queryClient,
  broadcastChannel: 'my-app',
})

import { broadcastQueryClient } from '@tanstack/query-broadcast-client-experimental'

const queryClient = new QueryClient()

broadcastQueryClient({
  queryClient,
  broadcastChannel: 'my-app',
})

API

broadcastQueryClient

向此函数传递一个 QueryClient 实例，以及可选地一个 broadcastChannel。

tsx

broadcastQueryClient({ queryClient, broadcastChannel })

broadcastQueryClient({ queryClient, broadcastChannel })

选项

一个选项对象：

tsx

interface BroadcastQueryClientOptions {
  /** 要同步的 QueryClient */
  queryClient: QueryClient
  /** 这将是用于在选项卡和窗口之间进行通信的唯一通道名称 */
  broadcastChannel?: string
  /** BroadcastChannel API 的选项 */
  options?: BroadcastChannelOptions
}

interface BroadcastQueryClientOptions {
  /** 要同步的 QueryClient */
  queryClient: QueryClient
  /** 这将是用于在选项卡和窗口之间进行通信的唯一通道名称 */
  broadcastChannel?: string
  /** BroadcastChannel API 的选项 */
  options?: BroadcastChannelOptions
}

默认选项是：

tsx

{
  broadcastChannel = 'tanstack-query',
}

{
  broadcastChannel = 'tanstack-query',
}