4

快速在项目中使用vuex

项目源代码在文章结尾
个人总结,有出错的地方还望大神指出
这只是如何去快速的使用它,你若想真正的去了解去学习那就到 官网 好好的看一看

vuex的目录结构

图片描述

state

项目中想要管理的数据和状态都在这了,“Vuex 使用 单一状态树 —— 是的,用一个对象就包含了全部的应用层级状态”,这就是为什么要用vuex的原因

图片描述

types

连接actions和mutations的桥梁

图片描述

actions

你可以粗略的理解为这就是事件方法函数,列出你想要做的事件
要注意:它提交的是mutation,不做数据和状态的更改,这些操作在mutations中处理
简单说就是中转一下,我在这里列出来我想干嘛(做计划),然后在mutations中去执行(实施计划)

这里的手动触发是指手动触发操作actions,然后actions会去自动触发操作mutations以获取值

图片描述

mutations

这是你实施计划的地方,也是唯一的
处理数据,操作状态,获取数据都在这里了

图片描述

getters

和state相对应,传递state中的数据

图片描述

更加详细的说明都在注释里面了,看着注释去理解代码

项目地址


Taste
254 声望7 粉丝

能做并不意味着应该做