我正在使用https://www.npmjs.com/package/vue-alertify在我的 API 请求在商店内部操作成功时发送通知：
import Vue from 'vue';
import Vuex from 'vuex';
import {
API_SUCCESS,
API_FAILURE,
} from './types/common';
Vue.use(Vuex);
/**
* Common State
* @property {boolean} isProgress - if async operation is in progress
*/
const state = {
isProgress: false,
};
/**
* Common Getters
* @property {boolean} isProgress - Checks if the async op is in progress
*/
export const getters = {
isProgress: state =>
state.isProgress,
};
/**
* Common Actions
*/
const actions = {
[API_SUCCESS]: ({}, message) => {
console.log(this);
this._vm.$alertify.success(message);
},
[API_FAILURE]: ({}, message) => {
this._vm.$alertify.failure(message || 'Failure');
},
};
/**
* Common Mutations
*/
const mutations = {
[PROGRESS_START]: (state) => {
state.isProgress = true;
},
[PROGRESS_STOP]: (state) => {
state.isProgress = false;
},
};
export default new Vuex.Store({
state,
getters,
actions,
mutations,
});
我正在像这样从组件@click 方法分派我的操作
persist() {
const { $store, } = this;
$store.dispatch(ca.PROGRESS_START);
$store.dispatch(ca.API_SUCCESS, 'Hey little!');
},
它在这一行失败了 this._vm.$alertify.success(message);
有错误
但是，如果我启用调试器并从控制台键入相同的命令 - 它可以工作并且我在浏览器上看到 $alertify 通知。