reactjs @tanstack/react-query:未设置QueryClient,请使用QueryClientProvider设置一个

ac1kyiln  于 12个月前  发布在  React
关注(0)|答案(1)|浏览(145)

我只在生产环境(next.js)上遇到这个错误,并不总是,只是有时候。
我在我的next.js项目中使用了@tanstack/react-query包。
未设置QueryClient,请使用QueryClientProvider设置一个
应用程序就会崩溃。这是我的实现

export default function App({ Component, pageProps }: AppProps) {
    const [queryClient] = useState(() => new QueryClient(options));

    return (
        <QueryClientProvider client={queryClient}>
            <ErrorBoundary>
                <HydrationBoundary state={pageProps.dehydratedState}>
                    <Providers pageProps={pageProps}>
                        <Component {...pageProps} />
                    </Providers>
                </HydrationBoundary>
            </ErrorBoundary>
        </QueryClientProvider>
    );
}

字符串
请注意,在同一个项目中,我使用了另一个包wagmi,它也使用了@tanstack/react-query,但版本不同(我使用5.0.0,他们使用4.3.2)。
我很感激任何关于如何解决这个问题的建议。

ogq8wdun

ogq8wdun1#

如果wagmi依赖于tanstack-query v4,您还需要使用tanstack-query v4。使用不同的版本意味着您安装了react-query的多个版本,这意味着从v5导入创建的上下文Provider对于使用v4的useQuery钩子的消费者将不可见。

相关问题