Vue84-Vuex的工作原理与搭建开发环境

一、vuex工作原理

  • stats:是一个object对象,里面有很多key-value,存放的就是要操作的数据。
  • mutations:是一个object对象,真正去操作stats的人。
  • actions的作用:是一个object对象,当一个动作对应的值需要发送ajax请求才能获取,则在actions中发送ajax请求。

实际上要操作的是,store提供的dispatch和commit函数。

当不需要发送ajax请求,也没有复杂的逻辑处理的时候,vuex允许不走actions,直接走multation。

目的:要让所有的组件实例对象都能看见store。

二、搭建vuex的开发环境

2-1、vuex的引入和使用

在main.js中引入和使用vuex

注意:

想要vm身上有新的属性,要引入和使用,否则随便写的话,vue是不认的!

只要vm身上有store,此时,所有的组件实例对象vc和vm都能有store。

store身上要有三个对象:actions、mutations、states;

store身上要有两个接口:dispatch、commit。

2-2、创建store

vue-cli的import问题:

即使import没有写在一起,vue-cli执行的时候也会把import汇总执行!

解决方式:

将vuex的引入和使用,放到store下的index.js文件中

三、小结

相关推荐
爱勇宝12 分钟前
裁员裁掉了那个干了14年的人:我这才看清职场的5条潜规则
前端·后端·程序员
Hilaku17 分钟前
GraphQL 在国内为什么水土不服?
前端·javascript·程序员
Latchh24 分钟前
PDF打开不要密码却显示已加密,前端怎么判断
前端·图像处理·人工智能·计算机视觉·pdf
秋天的一阵风25 分钟前
🧐 为什么大厂 RAG 从不用纯向量检索?
前端·面试·ai编程
恋猫de小郭35 分钟前
Flutter + EmbeddingGemma 2,谷歌发布完全端侧的 AI Edge Foresight
android·前端·flutter
FITA阿泽要努力42 分钟前
第1周·第2讲|一道综合代码推演
服务器·前端·python·agent.
iCxhust43 分钟前
如何批量导出edge保存的密码
前端·windows·edge
JarvanMo1 小时前
写 Flutter 不用再套六层 Widget 了
前端
小羊没烦恼!1 小时前
关于大型asp.net应用系统的架构-架构的选择
java·服务器·开发语言·前端·c#
GISer_Jing1 小时前
height、line-height、font-size相同字体遮挡问题
前端·ai