摘要: 1、认识ModuleModule是模块的意思,为什么在Vuex中我们要使用模块呢?Vue使用单一状态树,那么也意味着很多状态都会交给Vuex来管理当应用变得非常复杂时,store对象就有可能变得相当臃肿为了解决这个问题,Vuex允许我们将store分隔成模块(Module),而每个模块拥有自己的st 阅读全文
posted @ 2022-07-05 14:36 郭祺迦 阅读(838) 评论(0) 推荐(0) 编辑
摘要: 总结: state相当于一个data,存放数据的 getters相当于state的计算属性 mutations相当于修改state的属性,这个是同步的;我们可以使用Vue.set去给state添加某个属性或者Vue.delete删除某个属性 actions相当于mutations也是修改state的 阅读全文
posted @ 2022-07-05 14:36 郭祺迦 阅读(27) 评论(0) 推荐(0) 编辑
摘要: 1、Mutation同步函数通常情况下,Vuex要求我们Mutation中的方法必须是同步方法:主要的原因是当我们使用devtools时,devtools可以帮助我们捕捉mutation的快照但是如果是异步操作,那么devtools将不能很好的追踪这个操作什么时候会被完成通常情况下,不要在mutat 阅读全文
posted @ 2022-07-05 14:35 郭祺迦 阅读(907) 评论(0) 推荐(0) 编辑
摘要: 1、Mutation常量类型--概念我们来考虑下面的问题在mutation中,我们定义了很多事件类型(也就是其中的方法名称)当我们的项目增大时,Vuex管理的状态越来越多,需要更新状态的情况越来越多,那么意味着Mutation中的方法越来越多方法过多,使用者需要花费大量的经历去记住这些方法,甚至是多 阅读全文
posted @ 2022-07-05 14:32 郭祺迦 阅读(112) 评论(0) 推荐(0) 编辑
摘要: 1、Mutation响应规则Vuex的store中的state是响应式的,当state中的数据发生改变时,Vue组件会自动更新这就要求我们必须遵守一些Vuex对应的规则:提前在store中初始化好所需的属性当给state中的对象添加新属性时,使用下面的方式:方式一:使用Vue.set(obj, 'n 阅读全文
posted @ 2022-07-05 14:32 郭祺迦 阅读(825) 评论(0) 推荐(0) 编辑
摘要: 1、Mutation提交风格上面的通过commit进行提交是一种普通的方式Vuex还提供了另外一个风格,它是一个包含type属性的对象Mutation中的处理方式是将整个commit的对象作为payload使用,所以代码没有改变:我们可以看到我们输出的传入的参数,接收的字典;所以我们需要改一下通过p 阅读全文
posted @ 2022-07-05 14:31 郭祺迦 阅读(106) 评论(0) 推荐(0) 编辑
摘要: 1、Mutation状态更新Vuex的store状态的更新唯一方式:提交MutationMutation主要包括两部分:字符串的时间类型(Type)一个回到函数(handler),该回调函数的第一个参数就是stateMutation的定义方式:vuex文件下的index.js部分代码通过mutati 阅读全文
posted @ 2022-07-05 14:30 郭祺迦 阅读(118) 评论(0) 推荐(0) 编辑
摘要: 1、Getters基本使用 有时候,我们需要从store中获取一些state变异后的状态,比如下面的Store中:获取学年龄大于20的个数我们可以在Store中定义getters2、Getters作为参数和传递参数如果我们已经有了一个获取所有年龄大于20岁学生列表的getters,那么代码可以这样来 阅读全文
posted @ 2022-07-05 14:29 郭祺迦 阅读(420) 评论(0) 推荐(0) 编辑
摘要: 1、Vuex核心概念Vuex有几个比较核心的概念:StateGettersMutationActionModule2、State单一状态树Vuex提出使用单一状态树,什么是单一状态树呢?英文名称是Single Source of Truth,也可以翻译成单一数据源但是,它是什么呢?我们来看一个生活中 阅读全文
posted @ 2022-07-05 14:28 郭祺迦 阅读(89) 评论(0) 推荐(0) 编辑
摘要: 1、单页面的状态管理我们知道,在单个组件中进行状态管理是一件非常简单的事情什么意思呢?我们来看图片这图片中的三种东西,怎么理解呢?State:不用多说,就是我们的状态(姑且可以当做就是data中的属性)View:视图层,可以针对State的变化,显示不同的信息Actions:这里的Actions主要 阅读全文
posted @ 2022-07-05 14:25 郭祺迦 阅读(608) 评论(0) 推荐(0) 编辑
摘要: 1、Vuex是做什么的?官方解释:Vuex是一个专为Vue.js应用程序开发的状态管理模式它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化Vuex也集成到Vue的官方调试工具devtools extension,提供了诸如零配置的time-travel调试、 阅读全文
posted @ 2022-07-05 14:22 郭祺迦 阅读(45) 评论(0) 推荐(0) 编辑