资讯专栏INFORMATION COLUMN

vuex 入门教程

raoyi / 542人阅读

摘要:是什么想必大家已经看过官方文档。就我的理解来说,可以把它当成一个全局对象,可以在全局对其操作项目目录保存了整个对象的状态,数据的格式需要根据业务需求给定。

vuex是什么?
想必大家已经看过官方文档。就我的理解来说,可以把它当成一个全局对象,可以在全局对其操作state.
vuex项目目录

State

保存了整个对象的状态,数据的格式需要根据业务需求给定。

在这个小demo中a,b组件分别向c组件发送数据,所以定义了2个初始化数据;

Getters

一些简单或通用的操作可以抽取到getters上来,方便在应用中引用

比如:从c组件直接获取a,b组件发送过来的数据;分别定义了2个方法用来接收;

可以通过...mapGetters得到这2个方法发送的数据,也可以通过...mapState直接获取state里面的状态(图中注释部分)

Actions

所有数据的提交都在actions

可以通过图中方法触发子组件提交事件

commit是从对象解构出来方法,

通过commit把提交的数据传递给mutations

Mutations

通过commit提交过来的方法在

mutations继续加工(执行同步操作)

通过vuex的一个全局对象进行暴露

再把vuex.Store生成的实例挂载到根节点中

github源码地址:

https://github.com/jeromehan/... 如果您喜欢点个赞,您的点赞是我写下去的动力!

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/82785.html

相关文章

  • Vuex入门到上手教程

    摘要:它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。这需要对短期和长期效益进行权衡。改变中的状态的唯一途径就是显式地提交。在里使用进行延迟执行。上下文对象,这里你可以理解称本身。 这篇文章主要介绍了Vuex入门到上手教程,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧 一、前言 当我们的应用遇到多个组件共享状态时,会需...

    rollback 评论0 收藏0
  • vuex其实超简单,只需3步

    摘要:前言之前几个项目中都多多少少碰到一些组件之间需要通信的地方而因为种种原因的成本反而比还高所以技术选型上选用了但是不知道为什么团队里的一些新人一听到就开始退缩了因为很难真的很难吗今天我们用简单的步来证明一下有多简单纯属个人经验难免有不正确的地 前言 之前几个项目中,都多多少少碰到一些组件之间需要通信的地方,而因为种种原因,event bus 的成本反而比vuex还高, 所以技术选型上选用...

    zhichangterry 评论0 收藏0
  • Vuex10分钟入门

    摘要:它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。写需要的组件创建一个组件,怼下面的内容,你喜欢彬哥哪一点创建一个展示组件我喜欢彬哥打开,删掉没用的东西,直接怼下面的代码,到这里,架子就搭好了。 通过本文你将: 1.知道什么是Vuex. 2.知道为什么要用Vuex. 3.能跑一个Vuex的例子。 4.了解相关概念,面试的时候能说出一个所以然 5...

    idisfkj 评论0 收藏0
  • 超简单入门Vuex小示例

    摘要:写在前面本文旨在通过一个简单的例子,练习的几个常用方法,使初学者以最快的速度跑起来一个的示例。生成基于的项目基于脚手架生成一个项目常用命令项目名进入项目目录,使用先试着跑一下。子组件可以修改父组件和自己的数据。 写在前面 本文旨在通过一个简单的例子,练习vuex的几个常用方法,使初学者以最快的速度跑起来一个vue + vuex的示例。 学习vuex需要你知道vue的一些基础知识和用法。...

    linkin 评论0 收藏0

发表评论

0条评论

raoyi

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<