How to useQuery when button is clicked

[mobiixi36]

I know that when I want to fetch data, with this library I can do something like this:

const fetchData = async()=>{...}

// it starts fetching data from backend with this line of code
const {status, data, error} = useQuery(myKey, fetchData());

It works. But how to trigger the data fetching only when a button is clicked? , I know I probably could do something like <Button onPress={() => {useQuery(myKey, fetchData())}}/> , but how to manage the returned data and status...

[niki4810]

@mobiixi36 one option is to use manual querying

[weyert]

Yeah, the naming refetch sounds a bit counterintuitive in this case.

[tannerlinsley]

In the very near future (the next branch), manual has been replaced with enabled: Boolean, which will replace and combine both falsy/nullish query keys and manual mode. In this case, the refetch function should make more sense.

[levani]

I donno, for me it still does not 😁

[cliffordfajardo]

@levani here is an example passing the enabled flag with false to useQuery and later using refetch.
This example is from a popular stackoverflow answer

• https://stackoverflow.com/a/63113066/2971795

here is a live code sandbox example from the post as well: https://codesandbox.io/s/reactquery-manual-refetch-d16m9

[asm031s]

but when i use select refetch doesnt work