vuex的5个核心用法

vuex的属性5个核心用法

可以参考这个网址详细了解 Vuex详情 https://vuex.vuejs.org/zh/
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化（可以把多个组件链接起来）

Vuex中5个主要核心

1. State (相当于单页面data，用于存放需要组件中共享的数据）
2. Getter
3. Mutation(相当于单页面methods，存放自定义方法)
4. Action（相当于单页面methods，存放自定义异步方法，也就是访问服务器的方法）
5. 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