apollo
apollo copied to clipboard
Can't auto refetch data on mounted
I want to refetch the data every time my view is mounted.
I changed my default fetchpolicy
var apolloClient = new ApolloClient({ ...
defaultOptions: {
watchQuery: {
fetchPolicy: 'network-only'
},
query: {
fetchPolicy: 'network-only'
}
}
});
but this doesn't work, if the database have some changes and I mounted my view at least one time the data never will be updated until a web refresh.
Some hack that I did is to refetch on every mount
mounted: function() {
this.$apollo.queries.clientType.refetch({});
...
}
but also the loading state of the query is not changing it only refetches...
I used some fix provided by other issue, but it doens't work: #171
it maybe caused by ssrMode or ssrForceFetchDelay. in my case, setting ssrMode=false, ssrForceFetchDelay=0 for browser firgured out this problem.
I know there could be a bug here, but isn't this what subscriptions are for?
Maybe I can use a subscription, but I think it's a little bit overpowered and some cases a bit annoying.
In the case that an user want to interact with some data, change view and after some time want to return to the previous view would be awesome if there is updated data instead of fetching the data all the time
@BlueSeph28 Your code is invalid, it should be:
var apolloClient = new ApolloClient({ ...
defaultOptions: {
$query: {
fetchPolicy: 'network-only'
},
}
});
https://vue-apollo.netlify.com/guide/apollo/special-options.html
Sorry I didn't see it was ApolloClient
in your code. It's looking fine, not sure why it's not working.
So the issue is if one of your component is destroyed and mounted again, it won't do a request to the server?
Yes, it doesn't do a request... my app only get all the data from cache.
These are the steps to reproduce this.
- Go to view A this loads some queries.
- The queries are fetched from the server.
- Exit from the view A and go to view B.
- Return to the view A
- All data is showed to the user but is not updated from the server only fetched from cache.
I don't know if I'm misunderstanding the vue's lifecycle, apollo fetchPolicy or if this is a real bug.
Update
I noticed that only sometimes is refetching the queries, but frequently when the queries are refetched on view mount I have an error on the store
So, to fix that I need to run
this.$apollo.provider.defaultClient.resetStore();
on beforeDestroy to refetch all the data on view Mount
I'm seeing similar things in my app, as in, it appears that the fetchPolicy
does not make any difference and the data is always returned from cache...
Any updates on this? Still having the same issue in 2021