vuejs / apollo

🚀 Apollo/GraphQL integration for VueJS
http://apollo.vuejs.org
MIT License
6.02k stars 523 forks source link

Local 'watchLoading' should overwrite global watchLoading #927

Open yaki4 opened 4 years ago

yaki4 commented 4 years ago

The problem: I've got an apollo client with a global 'watchLoading' and i've got some query with specific 'watchLoading'. Both function are called when i do this query, wouldn't it make more sense that the specific function overwrite the global instead of both being executed ?

example: my config

apollo: {
watchLoading: '~/plugins/apollo-watch-loading-handler.js', // my default loading handler
    clientConfigs: {
      default: '~/apollo/client-configs/default.js'
    },
}

my smartQuery:

apollo: {
coolQuery: {
      query: require('@/apollo/queries/greatQuery'),
      update (data) {
        return data.greatQuery
      },
      watchLoading (isLoading) { // My handler that should overwrite the other handler
        this.loadingTest = isLoading
        console.log(isLoading, 'The handler that should be execute ')
      }
  }
}

I'm using Nuxt so maybe the package already doing that and the nuxt package is behind.

the-nicolas commented 4 years ago

For me that would make no sense. I don't want to have my global loading logic changed, just because one component registers some own loading indicator.

These are two different hooks and should not influence each other.

RoelRoel commented 4 years ago

How can you make it so that a component watchLoading blocks the global one? I've implementing an global blocking overlay for the global loader, but I don't want it for every call.

Edit: I now check in the global watchLoading if smartQuery.loadingKey (smartQuery is the third undocumented parameter) is set. When I have a local loading field I assume the global loading is not needed.