Ad

In Apollo Nuxt, How Do I Access The Non-default Client In A Method?

I'm using Apollo in a Nuxt app. I'm trying to use my non-default client (Shopify) in a method. Something like this ideally:

In my nuxt.config.js I have Apollo setup like this:

apollo: {
    clientConfigs: {
        default: {
            httpEndpoint:
                "http://example.com",
            tokenName: "apollo-token",
            persisting: false,
            websocketsOnly: false
        },
        shopify: {
            httpEndpoint:
                "http://example.shopify.com",
            tokenName: "apollo-token"
            ... etc...
        }
    }
}

And then in my component, I have this method:

methods: {
        createCheckout() {
            this.$apollo.getClient("shopify")
                .mutate({
                    mutation: this.checkoutQuery,
                    variables: {
                        variantId: this.selectedProduct.variantId,
                        quantity: this.selectedProduct.quantity
                    }
                })
        }
}}

This doesn't work, because getClient() only returns the default client (WordPress in this case). So how do I get access to the other client in a method?

Ad

Answer

Figured it out! The answer is this:

methods: {
        createCheckout() {
            this.$apollo.provider.clients.shopify
                .mutate({
                    mutation: this.checkoutQuery,
                    variables: {
                        variantId: this.selectedProduct.variantId,
                        quantity: this.selectedProduct.quantity
                    }
                })
        }
}}
Ad
source: stackoverflow.com
Ad