wawanopoulos
wawanopoulos

Reputation: 9794

VueX/VueJS: call mutation from another file

I'm searching the way to call a mutation on a store from another file which is not a single file component.

This file is responsible to manage the axios configuration to be able to make some API calls. I managed some interceptors and i would like to call a mutation to change state of the notification store to display a notification in UI.

import axios from "axios";
import i18n from './i18n';
import Vue from 'vue';

// Define global param object for notification options
const options = {
    type: "danger"
};

// Create global Axios instance for CTC Backends API calls
const instance = axios.create({
    baseURL: process.env.VUE_APP_BACKEND_URL,
});

// Define interceptor for responses to handle certain API responses
instance.interceptors.response.use(res => {
    console.log('axiosBackend::ResponseInterceptor()', res);
    return res;
}, error => {

    if (!error.response) {

        Vue.$store.commit("SHOW_NOTIFICATION", {
            text: i18n.t("serverError"),
            type: 'error'
        });

    } 

    return Promise.reject(error.response);

});

export default instance;

Upvotes: 1

Views: 4008

Answers (2)

import {store} from './store';

store.commit("SHOW_NOTIFICATION", paylo )

Upvotes: 0

NaN
NaN

Reputation: 1985

If I understand your problem properly. You have to import the store instance and use it to call the mutation.

import store from '@/store'
...
store.commit("SHOW_NOTIFICATION", {
...

Upvotes: 3

Related Questions