1.最重要的区别:vuex存储在内存,localstorage则以文件的方式存储在本地

2.应用场景:vuex用于组件之间的传值,(响应式的),localstorage则主要用于不同页面之间的传值(其他页面更新数据了,当前页面要刷新才能相应更新,非响应式的)

(响应式跟非响应式简直是说到点子上了)

3.永久性:当刷新页面时vuex存储的值会丢失(存在内存里的,刷新了,当然会丢失),localstorage不会。

注:很多同学觉得用localstorage可以代替vuex, 对于不变的数据确实可以,
但是当两个组件共用一个数据源(对象或数组)时,如果其中一个组件改变了该数据源,希望另一个组件响应该变化时,local torage无法做到.

-----

针对第3点,vuex就是一个“提升变量”的一个工具,它是将state当做全局变量存储。F5刷新页面之后自然随着页面的刷新重新初始化state。

目前想让浏览器记住数据,一般都会采用cookie或者localStorage、sessionStorage等方法

vuex和localStorage/sessionStorage 区别的更多相关文章

  1. cookie, localStorage, sessionStorage区别

    cookie 有过期时间,默认是关闭浏览器后失效,4K,兼容ie6,不可跨域,子域名会继承父域名的cookielocalStorage 永不过期,除非手动删除,5M,兼容IE8,不可跨域,子域名不能继 ...

  2. cookie session localstorage sessionStorage区别

    cookie:http://www.cnblogs.com/Darren_code/archive/2011/11/24/Cookie.html 重要特点: 1.cookie 有大小设置,有过期时间设 ...

  3. localStorage与sessionStorage区别

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

  4. cookies、sessionStorage、和localStorage的区别。

    为什么会有cookie和session? 我们都知道http是无状态的协议无连接的,客户每次在读取web页面时服务器都会打开新的会话.服务器不会自动维护客户上下文的信息,那么session就是一种保存 ...

  5. session,cookie,sessionStorage,localStorage的区别及应用场景

    session,cookie,sessionStorage,localStorage的区别及应用场景 浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式,可以利用cookie,session等跟 ...

  6. cookies,sessionstorage,localstorage的区别?

    请描述一下 cookies,sessionStorage 和 localStorage 的区别? sessionStorage 和 localStorage 是HTML5 Web Storage AP ...

  7. 缓存session,cookie,sessionStorage,localStorage的区别

    https://www.cnblogs.com/cencenyue/p/7604651.html(copy) 浅谈session,cookie,sessionStorage,localStorage的 ...

  8. cookies,sessionStorage 和 localStorage 的区别

    请描述一下 cookies,sessionStorage 和 localStorage 的区别? sessionStorage 和 localStorage 是HTML5 Web Storage AP ...

  9. cookie和localstorage sessionStorage的概念、区别、使用场景

    本文分为三大板块: 1 webStorage的概念 2 cookie/localStorage/sessionStorage的介绍 3 三者之间的共同点和区别 **所有代码引用均来自 作者:OBKor ...

随机推荐

  1. bzoj2654tree

    给定一个n个点m条边的图,每条边有黑白两色,求出恰好含need条白边的最小生成树 最小生成树...仿佛并没有什么dp的做法 大概还是个kruskal的板子再加点什么东西 考虑到“恰好含need条白边” ...

  2. 洛谷【P1100】高低位交换

    二进制前置技能:https://www.cnblogs.com/AKMer/p/9698694.html 题目传送门:https://www.luogu.org/problemnew/show/P11 ...

  3. Azure上部署FTP服务

    FTP是个比较复杂的协议,其协议分为控制层和数据层,工作模式分为主动和被动两种模式. 在默认的Active模式下其工作原理如下: 可以看到,客户端发起FTP的请求道服务器端,FTP的端口是21.用户在 ...

  4. POJ2785(upper_bound)

    #include"cstdio" #include"algorithm" using namespace std; ; int A[MAXN],B[MAXN], ...

  5. struts2 json返回试验

    <?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE struts PUBLIC "-/ ...

  6. [HDU1003]最长子序列和

    http://acm.hdu.edu.cn/showproblem.php?pid=1003 解题关键:1.最大连续子序列和模板 2.max.end不能使用,在oj中会显示编译错误 3.注意模板中没有 ...

  7. Servlet编程实例 续1

    -----------------siwuxie095                                 在 LoginServlet 中,右键->Open Type Hierar ...

  8. 树莓派 Learning 002 装机后的必要操作 --- 06 共用键鼠 之 windows和树莓派

    树莓派 装机后的必要操作 - 使用Synergy软件 共用键鼠 之 windows和树莓派 我的树莓派型号:Raspberry Pi 2 Model B V1.1 装机系统:NOOBS v1.9.2 ...

  9. Some of your uncommitted changes would be overwritten by syncing.Please commit your changes then try

    解决方法有三种,在GitHub shel中输入以下命令,任选一种方法就能解决问题 git reset --hard HEAD -- Destructive. When you do this you' ...

  10. npm ERR! Unexpected token in JSON at position 0 while parsing near '<HTML> 解决办法

    npm ERR! Unexpected token in JSON at position 0 while parsing near '<HTML> npm ERR! <!--/// ...