Vuex 白话理解

Vuex

官网地址:https://vuex.vuejs.org/zh/guide/modules.html.

State相当于单页面中的data.用来存储变量数据

获取数据:
store.state.变量 拿到数据(拿其中一个值)
在组建中使用辅助函数.一次获取多个值

Getter相当于computer. 当state中的数据变化时.会被重新计算,可以传参

获取值或者改变值
store.getters.属性 ||store.getters.属性(参数)
组件内获取多个计算属性

Mutation 相当于单页面中的事件,每个mutation都有一个事件类型type(类似于方法名)和一个回调函数(就是方法内你需要进行的变更state操作),这个事件接收的第一个参数就是state ,他是一个同步函数

触发方式
Store.commit(‘方法名’)

组件中获取

Active 类似于mutation.但是active只去触发mutation.在他的方法内不直接改变satate

可以包含异步操作,他接收的第一个参数是类似于store实例相同的方法和属性的context对象(可以接直接当做 store,这个存储器,实际上不是的),所以使用的时候可以直接
Context.state||context.getters||context.commit
== 接收 ==

== 简化.只接收要用到的参数,es6解构赋值==

外部触发
Store.dispatch(‘方法名’) 其实触发这个方法实际上他又去触发了mutation,因为是同步执行的,所以我们可以去触发active,在active内部进行异步操作(实际没有特别了解他们的区别)
载荷触发,(带着参数去触发)
Store.dispatch(‘方法名’,参数)
Store.dispatch(‘方法名’,{
属性:值 //这种形式最好
})

组件中获取多个

在不同模块中触发多个函数,并按照顺序执行

Module

当我们store中有很多state.很多方法很多操作时.一个store文件会显得很庞大且乱…不好维护,于是我们可以分割成模块module.每个模块拥有自己的state.mutation.action.getter

可以写成a.js,b.js然后再index.js中统一导出

后面复杂的暂未用到.白话不了…