T

TanStack•9mo ago•

1 reply

then-purple

No QueryClient set, use QueryClientProvider to set one

I'm trying to use useQuery/useSuspenseQuery with a tanstack start application, but I'm getting this error always
'''
route.tsx:40 Error: No QueryClient set, use QueryClientProvider to set one

The above error occurred in the <RouteComponent> component.

React will try to recreate this component tree from scratch using the error boundary you provided, CatchBoundaryImpl.
'''

I'm using this example: https://tanstack.com/start/latest/docs/framework/react/examples/start-basic-react-query as base

I already have:
'''
// __root.tsx
Import type {QueryClient} from "@tanstack/react-query"
export const Route = createRootWithContext<{queryClient: QueryClient}>()({
...
})
'''
'''
//router.tsx
export function createRouter() {
const queryClient = new QueryClient();

return routerWithQueryClient(
createTanStackRouter({
routeTree,
context: { queryClient },
defaultPreload: 'intent',
defaultErrorComponent: DefaultCatchBoundary,
defaultNotFoundComponent: () => <NotFound />,
}), queryClient
)
}
'''

And then in another file:
const {data} = useSuspenseQuery({
queryKey:['clients'],
queryFn: () => getClients()
})

Can someone help me???

React TanStack Start Start Basic React Query Example | TanStack Sta...

An example showing how to implement Start Basic React Query in React using TanStack Start.