mapState是一个语法糖,原来写法为
shuju(){
return this.$store.state.shuju;
}
mapState不用写的那么麻烦,computed:mapState({shuju:‘shuju’})
如果有自己的计算属性的话,要用扩展运算符,注意此时computed后面有大括号{}
则computed:{
zishen(){
return this.s+1
}
...mapState(['shuju'])
}
基本形式:
借助mapState生产计算属性,从state中读取数据,
对象写法
...mapState({he:'sum',xuexaio:'school',xueke:'subject'])
数组写法
...mapState(['sum','school','subject']),
从state中直接读取数据this.$store.state.shuju
this.$store.commit('fangfa',canshu)
this.$store.getters.shuju
模块化后:
mapState(['mokuai1','mokuai2'])读取数据时用this.state.mokuai1.shuju
或者想要直接读取模块里的数据就以下面这种命名空间形式。
mapState('mokuai1',['sum','school']),
mapgetters('mokuai1',['sum','school']),注意这样的是开启命名空间
第一个参数指定用哪一个模块,直接用不可以,必须使用namespace:true命名空间,才能使用
也可以不用命名空间,mapState({shuju:state=>state.mokuai1.shuju})注意这不是开启命名空间
从state中直接读取数据this.$store.state.mokuai1.shuju
this.$store.commit('mokuai1/fangfa',canshu)
this.$store.getters['mokuai1/shuju']注意这样的也是开启命名空间的getters只有mokuai1/shuju这个属性,且用.加属性这里不行,所以只能用[]加属性。如果用mapGetters的话和用其他的mapState一样。
getters没有划分模块,命名空间时会划分