vuex mapGetters方法,传参数
vuex mapGetters方法,传参数1.getters.js中方法:1.getters.js中方法:desc: (state) => (ss) => {console.log('SS:',ss)if (state.count<50) {return "吃饭";} else if (state.count>50 && state.count<100
·
vuex mapGetters方法,传参数
1.getters.js中方法:
//home.js文件
//在state中声明count
const state = {
count: 1
}
const getters = {
// desc: (state) => (ss) => {
// console.log('SS:',ss)
// if (state.count<50) {
// return "吃饭";
// } else if (state.count>50 && state.count<100) {
// return "睡觉";
// } else {
// return "打豆豆";
// }
// }
desc: function(state) {
return function(ss) {
if (state.count<50) {
return "吃饭";
} else if (state.count>50 && state.count<100) {
return "睡觉";
} else {
return "打豆豆";
}
}
}
}
const mutations = {
increment(state,n) {
state.count += n;
}
}
const actions = {
add(context,m) {
context.commit("increment",m);
}
}
export default {
namespaced: true,//解决模块命名冲突
state,
getters,
mutations,
actions
}
2.调用:
<div>
<!-- 调用,xxx是参数 -->
desc: {{desc(xxx)}}
</div>
<script>
// 导入mapGetters
import { mapGetters } from 'vuex'
export default {
computed: {
//...
...mapGetters({
desc: 'home/desc'
}),
// 或者
// ...mapGetters('home',['desc'])
}
}
</script>
home是什么意思:
import Vue from "vue";
import Vuex from "vuex";
import home from "@/store/modules/home"
import bill from "@/store/modules/bill"
import userInfo from "@/store/modules/userinfo";
Vue.use(Vuex);
const store = new Vuex.Store({
modules: {
home,//导出的模块名
bill,
userInfo
}
})
export default store
更多推荐
所有评论(0)