React Query - useQuery callback dependent on route parameter?

Viewed 11

Have a simple page setup in nextJS and use useRouter hook to grab the route param like so.

 const router = useRouter();
 const { user_id } = router.query;

I would like to fetch data using useQuery and passing in the user_id param into the callback function like so:

  const { isLoading, isError, isSuccess, data } = useQuery(
    ["user", user_id],
    () => getUser(user_id)
  );

The problem seems to be that the user_id is undefined when the component renders initially and thus that value is passed into the query callback function and essentially returns no data.

Is there anything I can do to delay the useQuery callback so that it fetches when user_id is defined? Any help would be appreciated.

0 Answers
Related