在vuex中getter相当于计算属性
1.在store.js中写上:
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
state:{
count:0,
},
mutations:{
changeCount:function (state,count) {
state.count=count
console.log(state.count)
},
getters: {
// 单个参数
countDouble: function(state){
return state.count * 2
},
// 两个参数
CountDoubleAndDouble: function(state, getters) {
return getters.countDouble * 2
}
}
})
2.在组件的页面写:(这里调用的方式有两种)
第一种:
<div class="add" @click="changeCount">+</div>
一个参数:{{countDouble}}
两个参数{{CountDoubleAndDouble}} <br />
</div>
data () {
return {
Acount:0,
}
},
(............重点............)
countDouble: function(){
return this.$store.getters.countDouble
},
countDoubleAndDouble: function(){
return this.$store.getters.countDoubleAndDouble
},
methods:{
changeCount(){
this.Acount++;
this.$store.commit('changeCount',this.Acount);
}
}
第二种:
import { mapGetters } from 'vuex'
...mapGetters([
'countDouble',
'CountDoubleAndDouble',
]),
无论用哪一种结果都是一样的,看个人喜好...........
复制代码
vuex中getter的用法
在vuex中getter相当于计算属性1.在store.js中写上:import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)export default new Vuex.Store({state:{count:0,},...
·
更多推荐
已为社区贡献893条内容
所有评论(0)