How to watch loading state in vue-apollo when the fetchPolicy is no-cache?

Viewed 487

If the fetchPolicy is set to no-cache I cannot watch the loading state. I tried different approaches.

The most common usage for me is the apollo component property:

  apollo: {
    trips: {
      query: gql`...`,

      loadingKey: 'loading',

      watchLoading (isLoading, countModifier) {
        console.log('isLoading', isLoading)
        console.log('countModifier', countModifier)
      }
    }
  },

  data() {
    return {
      trips: [],
      loading: 0
    }
  },

So

  1. watchLoading callback doesn't get called regardless if I specified loadingKey or not
  2. loading property never changed

I also tried to use computed property:

showLoader () {
    return this.$apollo.queries.trips.loading
}

That always return false.

And all of above is right only when no-cache is set.

0 Answers
Related