本文介绍了具有自定义名称的Vuex操作、Vuex模块和mapAction的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我一直在寻找如何在不键入所有操作名称的情况下在模板中使用Vuex操作，我的代码看起来是这样的：
export default new Vuex.Store({ modules: articles, auth, blabla})
我的articles.mode.js包含操作、getter等，其中一个操作如下：
[ArticleActions.remote.FETCH_ALL]({commit}) {something axios stuff}
导出时命名空间为true：
export const articles = {
namespaced: true,
state: initialState,
mutations,
actions,
getters
};
在我的组件ArticleList.vue中，我要对mapActions使用该操作：
methods: {
...mapActions('articles', [ArticleActions.remote.FETCH_ALL])
}
这样可以，但我不想在模板中使用ArticleActions.remote.FETCH_ALL的值我希望到期的是
methods: {
...mapActions('articles', [{fetchAll: ArticleActions.remote.FETCH_ALL}])
}
所以我只需要：
mounted(){fetchAll();}
而不是
mounted(){ArticleActions.remote.FETCH_ALL();}
我们可以这样做吗？
推荐答案
过了一段时间我自己想明白了，其实很简单.
...mapActions('articles', {
fetchAll: ArticleActions.remote.FETCH_ALL,
}
),
我坚持是因为我习惯了替代语法：
...mapGetters("articles", [
'articles',
])
所以我只尝试使用[]，但是解决方案是使用对象，希望它能有所帮助，很抱歉。 现在，如果我们这样做，它会起作用：
mounted(){this.fetchAll();}
这篇关于具有自定义名称的Vuex操作、Vuex模块和mapAction的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！
本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除！