react-query，refetch 不会触发 useEffect

Question

I want to refetch the data after save is succeeded.

here is the demo that demonstrates the issue -

https://codesandbox.io/s/romantic-orla-h9scuc?file=/src/index.js

Issue here is useEffect not gets triggered after data changes. So the log from line 111 never happens...

Is this behaviour expected?? If not What am I doing wrong??

Also If this behaviour is expected then how to get the latest data programmatically?

Answer 1

I don't know much about React-Query but in RTK Query after using refetch , for this kind of behavior, you should pass isFetching to useEffect . This works like a charm and useEffect runs again when refetching is done.

Answer 2

That happens because you already re-fetch the same data with the same reference because react-query gets it from the cache, So according to useEffect the data doesn't change at all, and will not re-execute.

So, That's the expected behavior.