当前位置:   article > 正文

Vuex系列之 State 的使用_vue中state在项目中如何去用

vue中state在项目中如何去用


State 提供唯一的公共数据源,所有共享的数据都要统一放到 Store 的 State 中进行存储。

// 创建store数据源,提供唯一公共数据
export default new Vue.Store({
	// state 中存放的就是全局共享的数据
	state: {
		count: 0
	},
	mutations: {},
	actions: {},
	getters: {}
});
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10

一、组件访问 State 中数据的第一种方式:

this.$store.state.全局数据名称
  • 1

二、组件访问 State 中数据的第二种方式:

1、从 vuex 中按需导入 mapState 函数

import { mapState } from "vuex";
  • 1

通过刚才导入的 mapState 函数,将当前组件需要的全局数据,映射为当前组件的 computed 计算属性

2、将全局数据,映射为当前组件的计算属性

computed: {
	...mapState(["count"])
}
  • 1
  • 2
  • 3

写在最后

如果你感觉文章不咋地//(ㄒoㄒ)//,就在评论处留言,作者继续改进;o_O???
如果你觉得该文章有一点点用处,可以给作者点个赞;\\*^o^*//
如果你想要和作者一起进步,可以微信扫描二维码,关注前端老L~~~///(^v^)\\\~~~
谢谢各位读者们啦(^_^)∠※!!!

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/羊村懒王/article/detail/256902
推荐阅读
相关标签
  

闽ICP备14008679号