TanStackT
TanStack17mo ago
5 replies
popular-magenta

usePrefetchQuery + useQuery for Form Validation

I have a Form where the user inputs an address.
Once the Address is entered (Street, Postal Code, City) I fire use usePrefetchQuery to check against a backend if the entered data is a know address

When the user submits the form I need to display a option to the user if there where multiple matching locations for the entered data.

How would I do that?

onSubmit: async ({ value }) => {
  // this won't wait for the results…
  const { data } = useQuery({ getValidatedAddresses(value.adress) })
}


The benefits in using usePrefetchQuery would be that the user would not have to wait for the request once the form is submitted as there's more fields (after the address) for them to fill before they hit submit.
Was this page helpful?