TanStackT
TanStack2mo ago
8 replies
slow-yellow

Execute query mutation in beforeLoad of tanstack router

Hi, What is best practice to execute a mutation when a seach param is added to the URL?
  const code = Route.useSearch({ select: (search) => search.code })
  const handleVerify = (code: string) => {
    verifyMutation.mutate(code, {
      onSuccess: () => {
        toast.success('Email account connected successfully');
        handleSync();
      },
    });
    // Remove code from url to prevent verify on refresh
    navigate({
      search: {},
    });
  };


  useEffect(() => {
    if (code) handleVerify(code);
  }, [code]);

This is the only thing i came up with but i know we are not in favor of using useEffect for stuff like this so idealy i want to execute the mutation in the beforeLoad function but how can we achieve this?
Was this page helpful?