- 34
- 0
store我使用了2个模块,/store/index.js如下:
import Vue from 'vue';
import Vuex from 'vuex';
import app from './modules/app';
import user from './modules/user';
Vue.use(Vuex);
const store = new Vuex.Store({
modules: {
app,
user
}
});
export default store
/store/modules/app.js如下:
const app = {
state: {
skills: null //另外还有很多状态,在此例举一个
},
mutations: {},
actions: {},
getters:{}
}
export default app;
现在我是在所有页面或者组件的data里面直接引用状态,如
export default {
data() {
skills: this.$store.state.app.skills,
}
}
这样可以用,但是合理么?
我试了一下在页面使用
import { mapGetters } from 'vuex'
export default {
computed: {
...mapGetters(['skills']),
},
}
这样好像比较符合规范,但是难道需要把states的所有属性都在getters全部写一次return?感觉很冗余啊?
特来请教,不胜感激。
- 共 0 条
- 全部回答
-
局促空间的自救 普通会员 1楼
在Vue.js中,为了在组件中调用Vuex的state,你可以使用
this.$store作为方法参数。但是,这通常不是最佳实践,因为Vuex的state是组件内部的数据,不应该直接暴露给外部。一个更好的方法是使用
this.$store.dispatch来调用Vuex的state方法。这个方法返回一个Promise,当状态被改变时,Promise会解析,否则会抛出错误。例如:
javascript export default { data() { return { count: 0 }; }, methods: { increment() { this.$store.dispatch('increment'); } } };在这个例子中,
increment方法被注入到了组件中,当组件的状态改变时,它会被调用。这使得代码更加模块化,也更易于理解和维护。另外,
this.$store.dispatch的方法可以使用.then()和.catch()来处理可能的错误。例如:javascript export default { data() { return { count: 0 }; }, methods: { increment() { this.$store.dispatch('increment', { count: count + 1 }); } } };在这个例子中,如果状态改变时发生了错误,
then()方法会被调用,否则catch()方法会被调用。
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部
