看到map 我们首先想到了映射
没错 这就是关于Vuex中的state、mutations、actions和getters的映射
以下为组件内
首先引入
因为是组件中在使用映射 所以从【组件】中导入
import { mapStete, mapMutations,mapActions,mapGetters } from 'vuex'
然后还是模块化写法
export default{
data () {
},
computed: {
...mapState(['count']),//state只能写在计算属性computed中 这里可以在数组内写多个方法名
...mapGetters(['funcname'])//也是只能写在computed中,getters其实就是一个包装state的一个函数
//他改变不了state里面的内容 但是会随着state改变而改变 有点类似于计算属性
//调用方法同样为两种 一种为this.$store.getters.名称 第二种为映射
},
methods: {
...mapMutations(['sub','add']),
//上一篇提到的触发actions的第二种方式 其实就是这个mapActions的映射方法
...mapActions(['subAsync']),//store中actions里面的方法
handel1(){
this.sub('自定义的可选参数')
//注意 这里通过映射的函数方法 可以不在此处定义 而直接应用在事件所触发的方法名里面
//比如本来@click触发的handel1 现在可以直接@click sub('自定义的可选参数')
}
}
}
而此时 在store内 这些个store的方法都是需要声明的