How to execute query based on click event??

[shamxeed]

How can I be able to make a query request to the server when someone clicks let's say a button?? useQuery hook automatically fires which not helpful in my use-case. Thanks!!!

[JoviDeCroock]

const MyComponent = () => {
  const [result, execute] = useQuery({ query: yourQuery, pause: true });
  
   const onlick = () => {
     // You can pass in context here, example requestPlicy
     execute({ requestPolicy: 'network-only' })
   }
}

pause is used to not automatically fire as mentioned in the docs

[shamxeed]

Thank you so much!!

[shamxeed]

Your solution works great for me, but please is there any possibility to return a promise-based response when making a query? I mean, just like mutations. So that for example we can attach a callback function?

e.g

const onCheckEmailAvailabilty = () => {
   checkEmailAvailabilty({requestPolicy: 'network-only'}).then(res => {
      if(res.error) return alert(res.error)
      updateUser({
         id,
         email
      })
      alert('email has been updated')
   })
}

Async/Await

const onCheckEmailAvailabilty = async () => {
   const res = await checkEmailAvailabilty({requestPolicy: 'network-only'})
   if(res.error) return alert(res.error)
   updateUser({
      id,
      email
   })
   alert('email has been updated')
}

Thanks a lot for your great help!!!

[JoviDeCroock]

https://formidable.com/open-source/urql/docs/basics/core/#one-off-queries-and-mutations

You can get the client with useClient

[shamxeed]

Can't thank you enough!!! Exactly what I was looking for...