I am looking to update or refetch data in an Apollo query that is used within a method rather than directly through the Apollo object. The challenge I’m facing is that I need to query and update this data after a specific event, so it’s not feasible to use the Apollo object directly in my code.
methods: {
async fetchEvents() {
const { data } = await this.$apollo.query({
query: gql`
query(
$someThing: Int,
) {
events (
someThing: $someThing,
) {
total
items {
...
}
}
}
`,
variables() {
return {
...
};
},
});
this.data = data;
},
},
watch: {
'items.view.organizerId': function callback() {
this.fetchEvents();
},
eventsSearchInputVal: function callback() {
this.fetchEvents();
},
'pagination.statusFilter': function callback() {
this.fetchEvents();
},
},
To summarize, when pagination.statusFilter, eventsSearchInputVal, or items.view.organizerId in the watch section change, the query should be refetched. However, in this current implementation, nothing happens when those variables are modified.