Open
Description
Describe the bug
When i try to call following code in my method, i'll get an error:
TypeError: undefined is not an object (evaluating 'this.provider.defaultClient')"
To Reproduce
Calling this snippet of code in one method of my components:
this.$apollo.mutate({
mutation: TOGGLE_LIKE,
variables: {
postId,
},
})
.then((result) => {
this.waitingForLike = false;
})
.catch((error) => {
console.log(error);
})
My main.js looks like this:
import Vue from 'nativescript-vue'
import App from './App';
import store from './store'
import apolloProvider from './vendors/vue-apollo';
new Vue({
store,
apolloProvider,
template: `
<App />
`,
components: {
App
}
}).$start();
vue-apollo.js
import Vue from 'nativescript-vue';
import VueApollo from 'vue-apollo';
import { ApolloClient } from 'apollo-client';
import { createHttpLink } from 'apollo-link-http';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { onError } from 'apollo-link-error';
import { setContext } from 'apollo-link-context';
import store from '../store';
const httpEndpoint = (() => store.getters['application/graphHttp']);
const httpLink = createHttpLink({
uri: httpEndpoint
});
const authMiddleware = setContext(async (_, { headers }) => {
let token = null;
await store.dispatch('auth/getToken')
.then((accessToken) => {
token = accessToken;
})
.catch((error) => {
console.error('error getting token from vuex store');
});
return {
headers: {
...headers,
authorization: token ? `Bearer ${token}` : '',
'X-APP-VERSION': global.APP_VERSION,
'X-APP-TOKEN': global.VUE_APP_X_TOKEN,
},
};
});
const errorMiddleware = onError(({ graphQLErrors, networkError }) => {
if (graphQLErrors) {
if (graphQLErrors[0].message === 'in maintenance') {
console.error('application in maintenance mode');
}
} else if (networkError) {
console.error('network error detected');
}
})
const defaultOptions = {
link: errorMiddleware.concat(authMiddleware.concat(httpLink)),
persisting: false,
websocketsOnly: false,
ssr: false,
cache: new InMemoryCache(),
defaultHttpLink: false,
}
const apolloClient = new ApolloClient({
...defaultOptions
});
Vue.use(VueApollo);
const apolloProvider = new VueApollo({
defaultClient: apolloClient
});
export default apolloProvider;
export function getApolloClient() {
return apolloClient;
}
Expected behavior
I want to run this mutation.
Versions
vue: 2.6.11
vue-apollo: 3.0.3
apollo-client: 2.6.10
Additional context
I use this in combination with nativescript-vue version 2.6.1