33、vuex初探(一)

前言:前面已经为了这章做了一点铺垫了,关于vuex也有很多读者私信我关于这方面的问题,其实vuex也很简单,今天我们就来探探vuex。 GitHub:https://github.com/Ewall1106/mall(选择chapter33分支)

1、vuex基本概念

  • Vuex是什么?Vuex 是一个专为Vue.js应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。
  • 关于vuex的基本概念解释基本就是一张图的事情:

截图来自vuex官网

大家好好看看官网的解释。

2、初探实践

看完以后应该是有点懵逼的,所以这就是这篇文章存在的意义了:就是让你不那么懵逼;总归理论与实践相结合才能真正弄明白一个东西,所以我们简单实践一下。

(1)安装

vuex安装

(2)然后就是新建一个store文件专门用于我们vuex的状态管理;

  • store文件夹下新建一个一个index.js
  • 引入vuevuex并注册
  • 导出vuex
  • 定义了一个state对象,这个对象包含了全部应用层级状态(全局共用的数据)

引入

(3)然后我们还需要在main.js中注册这个vuex仓库

注册

这样,我们安装及引用的一个vuex初始化就完成了。

(4)接下来我们在任意一个页面如test.vue中尝试获取到我们开始在state对象中定义的city值了

获取city值

浏览器中展示

3、小结

这就是我们vuex的初探的第一次内容,主要就是安装及引入,然后在页面中获取了state对象中的city值。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏技术碎碎念

OS存储器管理(一)

存储器的层次: 分为寄存器、主存(内存)和 辅存(外存)三个层次。 主存:高速缓冲存储器、主存储器、磁盘缓冲存储器,          主存又称为可执行存储...

41990
来自专栏DOTNET

log4net使用注意事项

1配置Log4net Log4net的配置文件有几种使用方式,这里将配置log4net的部分独立出来,即关于log4net的配置独立成文件log4net.con...

457120
来自专栏linux、Python学习

案例+解读,来自有道大神的17个常用Linux命令深度解析

命令后带(Mac)标记的,表示该命令在Mac OSX下测试,其它的在Debian下测试。

18360
来自专栏玄魂工作室

安全杂谈——linux通配符绕过文件名黑名单

linux shell下可以通过正则匹配来匹配相应的程序并且执行。 在linux下输入man 7 glob命令可以查看相关的内容。值得注意的就这些,学过正则的一...

15220
来自专栏哲学驱动设计

Rafy 领域实体框架 - 树型实体功能(自关联表)

在 Rafy 领域实体框架中,对自关联的实体结构做了特殊的处理,下面对这一功能进行讲解。 场景 在开发数据库应用程序时,往往会遇到自关联表的场景。例如,分类信息...

22680
来自专栏用户画像

3.1.4.2 基本分段存储方式

分页管理方式是从计算机的角度考虑设计的,以提高内存的利用率,提高计算机的性能,提升计算机的性能,且分页通过硬件机制实现 ,对用户完全透明;

13320
来自专栏C/C++基础

Linux命令(25)——cp命令

cp命令主要用于复制文件或目录,可以将一个或多个源文件或者目录复制到指定的目的文件或目录,当一次复制多个文件时,目标文件参数必须是一个已经存在的目录,否则将出现...

18320
来自专栏漫漫全栈路

ASP.NET MVC学习笔记05模型与访问数据模型

上一篇使用的M模型,并不是真正意义上的Model,现在来添加一些类,并将这些类用来管理数据库中数据(电影)。而这些类,就是ASP.NET MVC中的Model...

31840
来自专栏ml

web基础之Structs(一篇)

为什么有 struts 框架 Struct 的优点之处: 1.       struct的好处 2.       程序更加规范化 3.       程序的可...

41380
来自专栏Coding迪斯尼

java开发系统内核:使用LDT保护进程数据和代码

12430

扫码关注云+社区

领取腾讯云代金券