vuex的属性5个核心用法
可以参考这个网址详细了解 Vuex详情 https://vuex.vuejs.org/zh/
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化(可以把多个组件链接起来)
Vuex中5个主要核心
- State (相当于单页面data,用于存放需要组件中共享的数据)
- Getter
- Mutation(相当于单页面methods,存放自定义方法)
- Action(相当于单页面methods,存放自定义异步方法,也就是访问服务器的方法)
- Module
用脚手架创建Vue项目时勾选
项目中src/store/index.js是我们要的Vuex
下面说一下不同组件如何运用Vuex中的属性
不管是获取store中的state还是Mutatoion还是Action都必须先获取到$store的实例
this.$store 相当于获取到了$store的实例,如何通过实例在获取里面的对象store中的属性值count
// 注意在视图中可以省略this直接$store.state.count
//在methods中不能省略this
我们在store/index.js 中的state声明有个变量count,在add/subject获取方法
this.$store.state.count
commit方法用于调用vuex store中的mutations中的方法
- 参数1:方法名称
- 参数2:(可以可无)传递的参数
dispatch方法用于调用vuex store中的actions异步的方法
Vuex store
代码详情
父组件:App.vue
子组件:Add.vue
子组件:Subject.vue
store/index.js