vuex/vuejs:从另一个文件调用突变

Question

我正在搜索从另一个文件不是单个文件组件的商店上调用突变的方式。

此文件负责管理Axios配置，以便能够进行一些API调用。我管理了一些拦截器，我想致电一个突变以更改通知存储的状态，以在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;

Answer 1

如果我正确理解您的问题。您必须导入商店实例并使用它来调用突变。

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

Answer 2

import {store} from './store';
store.commit("SHOW_NOTIFICATION", paylo )