watch not working on data ref

First of all, thank you for your great work in this library. I encountered an issue when replacing useAsyncState with useQuery in my project. It seems that the data ref cannot be watched, i.e the watcher doesn’t respond when data is fetched from the API. As a result useStorage from vue-use does not work on vue-query data.

I’ve prepared a codesandbox that demonstrates the issue here. When you select a user from the users’ list you’ll notice that although the user data gets updated, the watcher (which is setup inside store.js) does not fire. When you replace useQuery with useAsyncState inside the Users.vue file, the watcher fires as expected. I’ve also tried the same thing with swrv and the watcher fires as expected as well.

Watch not working with vue-query

Watch working with vue-use useAsyncState

[wobsoriano]

Ah yes the readonly wrap can be removed there I think

[Mosaab-Emam]

Thanks @Holi0317, watching dataUpdatedAt fixed it for me.