vuex概念之State用法详解
假设有如下state定义一、普通用法在组件中直接访问:this.$store.state.count二、mapState辅助函数用法1使用对象展开运算符,会默认传递参数state,在函数中直接使用就可以了。这样就可以少些2个单词了(this.$store)...mapState({count: state => state.count})三、map...
·
假设有如下state定义
一、普通用法
在组件中直接访问:
this.$store.state.count
二、mapState辅助函数用法1
使用对象展开运算符,会默认传递参数state,在函数中直接使用就可以了。这样就可以少些2个单词了(this.$store)
...mapState({
count: state => state.count
})
三、mapState辅助函数用法2
为了能够使用 `this` 获取组件自己的data数据,必须使用常规函数
...mapState({
count: function (state) {
return state.count + this.localCount
}
}),
四、mapState辅助函数用法3
当在计算属性中直接引用state的数据时,可以直接传递字符串数组。
...mapState([
'count'
])
这种写法就相当于上面的《mapState辅助函数用法1》
五、mapState的这几种用法可以混合使用
在计算属性中,可以根据实际需要,灵活的组合使用mapState的上面的3种用法。
...mapState({
countAll: function (state) {
return state.count + this.localCount
}
}),
...mapState([
'count'
])
更多推荐
已为社区贡献5条内容
所有评论(0)