vuex中如何调用main。js挂载的全局方法
时间: 2024-09-26 09:07:47 浏览: 28
vue项目中,main.js,App.vue,index.html的调用方法
5星 · 资源好评率100%
在Vue.js的Vuex状态管理库中,直接调用`main.js`挂载的全局方法通常是在组件内部不需要通过Vuex获取数据或者需要执行异步操作时。如果你想从Vuex store里触发这个全局方法,首先你需要确保这个方法已经暴露给store实例,可以通过`mapActions`、`mapGetters`或者自定义的`actions`和`mutations`来达到目的。
例如,假设你在`main.js`中定义了一个名为`doGlobalAction`的全局函数:
```javascript
// main.js
import Vue from 'vue';
import Vuex from 'vuex';
const store = new Vuex.Store({
// ...
actions: {
doGlobalAction(context) {
context.commit('globalAction');
}
},
mutations: {
globalAction(state) {
this.doSomething(); // 全局函数的调用
}
}
});
export default store;
// 或者你在其他地方导出它
export { doGlobalAction };
```
然后,在某个Vuex模块的`actions`中,你可以像下面这样调用这个方法:
```javascript
// your-module.js
import { doGlobalAction } from '@/main.js'; // 如果是在同级目录下
export const actions = {
someAction({ commit }) {
doGlobalAction(commit);
// 这里提交mutation来触发全局方法
}
};
```
当你在某个Vuex的action或module中使用`doGlobalAction`时,它就会按照你的设置去执行对应的全局方法。
阅读全文