vuex是状态管理,是为了解决跨组件之间数据共享问题的,一个组件的数据变化会映射到使用这个数据的其他组件当中。如果刷新页面,之前存储的vuex数据全部都会被初始化掉。

localStorage是H5提供的一个更简单的数据存储方式,之前是用cookie存放数据,但是cookie的数据量太小,所以就用localStorage,它可以有5M的限制,不受刷新页面的控制,长久保存。

所以,在用vue进行项目开发的时候,什么时候用到vuex呢?

当应用遇到多个组件共享状态时候,即:多个视图依赖于同一个状态,不同视图的行为需要变更同一状态。

vuex的官网也说了,对于页面之间的传参对于多层嵌套组件将会很繁琐,而且对于兄弟组件之间的状态传递无能为力。所以就将这些组件的共享状态抽取出来,以一个全局单例模式管理,即vuex。

vuex和全局变量的区别:

1,【响应式】vuex的状态存储是响应式的,当Vue组件从store中读取状态的时候,若store中的状态发生变化,那么相应的组件也会得到高效更新。

2,【不能直接改变store】不能直接改变store的变化,改变store中状态的唯一途径是commit mutation。方便于跟踪每一个状态的变化。

vuex和localStorage,全局变量的区别的更多相关文章

  1. vuex和localStorage的存储区别

    vuex中的数据是存储在内存中的,localStorage中的数据是存储在浏览器的application中的

  2. vuex和浏览器【sessionStorage,localStorage ..】 得区别

    1.Vuex的主要作用是用来共享和管理数据,那为什么不直接使用浏览器缓存呢?2.Vuex和浏览器缓存策略的根本区别是什么?3.Vuex,state仓库中的数据流是单向同步的,那为什么可以在action ...

  3. 详解vuex结合localstorage动态监听storage的变化

    这篇文章主要介绍了详解vuex结合localstorage动态监听storage的变化,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧 需求:不同组件间共用同一数据,当一个 ...

  4. localStorage与sessionStorage区别

    localStorage与sessionStorage区别:浏览器正常模式下:    关闭浏览器或该窗口标签时,localStorage数据依然保存,但是sessionStorage数据会被清除.   ...

  5. c 语言中宏定义和定义全局变量的区别

    宏定义和定义全局变量的区别: 1 作用时间不同. 宏定义在编译期间即会使用并替换,而全局变量要到运行时才可以. 2 本质类型不同. 宏定义的只是一段字符,在编译的时候被替换到引用的位置.在运行中是没有 ...

  6. static全局变量与普通全局变量的区别,static局部变量与普通局部变量的区别,static函数与普通函数的区别

    static全局变量与普通全局变量的区别 static全局变量和普通全局变量的存储方式没有不同,如果它们都已经初始化,那么存放在进程的数据段中,否则存放在bss段.这两者的不同点在于作用域不同,当一个 ...

  7. vuex和localStorage/sessionStorage 区别

    1.最重要的区别:vuex存储在内存,localstorage则以文件的方式存储在本地 2.应用场景:vuex用于组件之间的传值,(响应式的),localstorage则主要用于不同页面之间的传值(其 ...

  8. vuex、localStorage、sessionStorage之间的区别

    vuex存储在内存中,localStorage以文件形式存储在本地,sessionStorage针对一个session(阶段)进行数据存储. 当页面刷新时vuex存储的数据会被清除,localStor ...

  9. cookie、 sessionStorage 、localStorage之间的区别和使用

    1.cookie:存储在用户本地终端上的数据.有时也用cookies,指某些网站为了辨别用户身份,进行session跟踪而存储在本地终端上的数据,通常经过加密.一般应用最典型的案列就是判断注册用户是否 ...

随机推荐

  1. The Tower(ccpc吉林)

    http://acm.hdu.edu.cn/contests/contest_showproblem.php?pid=1005&cid=867 #include<iostream> ...

  2. Java 集合的迭代方式

    集合的迭代流使得程序员得以站在更高的抽象层次上对集合进行操作.传统的迭代方法直接看代码: List<Dog> dogs = new ArrayList<>();        ...

  3. QT中的QQueue类、C++中的queue类

    C++中的queue 实现一种先进先出的数据结构,是一个模板类 头文件 #include<queue> queue<int> Q; //定义一个int型队列 Q.empty() ...

  4. 用css3实现图片的放大缩小

    记录一个公用的css实现图片的放大缩小 @keyframes scaleDraw { /*定义关键帧.scaleDrew是需要绑定到选择器的关键帧名称*/ 0%{ transform: scale(1 ...

  5. Java找出两个链表的第一个公共节点

    题目描述输入两个链表,找出它们的第一个公共结点. 我的思路:因为是链表,长度都是未知的,不能盲目的两个一起开始自增判断. 首先需要得到 L1的长度 和 L2的长度,让较长的那个先走 (length1- ...

  6. Hibernate之cascade属性和inverse属性

    1.cascade属性 cascade属性的作用是描述关联对象进行操作时的级联特性,只有涉及关系的元素才有cascade属性.具有cascade属性的标记包括<many-to-one/>. ...

  7. 吴裕雄--天生自然 人工智能机器学习实战代码:ELASTICNET回归

    import numpy as np import matplotlib.pyplot as plt from matplotlib import cm from mpl_toolkits.mplot ...

  8. SpringMVC_Day01

    项目结构 //SpringMVC配置文件 <?xml version="1.0" encoding="UTF-8"?> <!-- spring ...

  9. Introduction Of Gradient Descent

    不是一个机器学习算法 是一种基于搜索的优化方法 作用:最小化一个损失函数 梯度上升法:最大化一个效用函数 import matplotlib.pyplot as plt import numpy as ...

  10. Python sys.path详解

    如何将路径“永久"添加到sys.path? sys.path是python的搜索模块的路径集,是一个list ['', 'C:\\WINDOWS\\system32\\python26.zi ...