vuex、localStorage、sessionStorage之间的区别
vuex存储在内存中,localStorage以文件形式存储在本地,sessionStorage针对一个session(阶段)进行数据存储。
当页面刷新时vuex存储的数据会被清除,localStorage是永久存储,数据不会被清除,sessionStorage(会话存储),临时存储,当前窗口关闭后数据被清除。
localStorage和session只能存储字符串,对于复杂的对象需要使用JSON中的stringfy和parse来处理。
vuex用于组件之间的传值(响应式),localStorage和sessionStorage则主要用于不同页面之间的传值(其他页面更新数据后,当前页面要刷新才能相应更新,非响应式的)。因此,如果两个组件共用一个数据源,其中一个组件改变了该数据源,希望另一个组件响应该数据时,localStorage和sessionStorage无法做到。
localStorage本质上是对字符串的读取,如果存储内容过多的话会消耗内存空间,导致页面变卡。

vuex、localStorage、sessionStorage之间的区别的更多相关文章
- cookie、localStorage、sessionStorage之间的区别
sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可以方便的在web请求之间保存数据.有了本地数据,就可以避免数据在浏览器和服务器间不必 ...
- Cookie、session和localStorage、以及sessionStorage之间的区别
一.Cookie.session和localStorage的区别 cookie的内容主要包括:名字.值.过期时间.路径和域.路径与域一起构成cookie的作用范围.若不设置时间,则表示这个cookie ...
- localstorage sessionstorage cookie的区别
一.基本概念 Cookie cookie比较小,大小限制在4kb左右,是网景公司的前雇员 LouMontulli 在1993年3月的发明.它的主要用途有保存登录信息,比如你登录某个网站市场可以看到“记 ...
- 客户端 localStorage, sessionStorage, cookie 的区别
SessionStorage, LocalStorage, Cookie这三者都可以被用来在浏览器端存储数据,而且都是字符串类型的键值对! 区别在于前两者属于WebStorage,创建它们的目的便是存 ...
- LocalStorage和sessionStorage之间的区别
众所周知,自从HTML 5 标准出现之后,本地化存储一度成为热搜的关键词.在HTML 5 最开始时,本地存储有两种方式:一种是web Storage,另一种是web SQL.由于web SQL的实现是 ...
- 本地存储cookie,localStorage,sessionStorage
常见的前端存储有老朋友 cookie,短暂的 sessionStorage,和简单强大的localStorage 他们之间的区别有以下几点 1.. cookie在浏览器和服务器间来回传递.而sessi ...
- vuex和localStorage/sessionStorage 区别
1.最重要的区别:vuex存储在内存,localstorage则以文件的方式存储在本地 2.应用场景:vuex用于组件之间的传值,(响应式的),localstorage则主要用于不同页面之间的传值(其 ...
- cookie、 sessionStorage 、localStorage之间的区别和使用
1.cookie:存储在用户本地终端上的数据.有时也用cookies,指某些网站为了辨别用户身份,进行session跟踪而存储在本地终端上的数据,通常经过加密.一般应用最典型的案列就是判断注册用户是否 ...
- sessionStorage 、localStorage 和 cookie 之间的区别
sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可以方便的在web请求之间保存数据.有了本地数据,就可以避免数据在浏览器和服务器间不必 ...
随机推荐
- 攻防世界 reverse pingpong
pingpong XCTF 3rd-BCTF-2017 java层代码很简单: 1 package com.geekerchina.pingpongmachine; 2 3 import andro ...
- Python中切片的应用
Python中切片的应用 Python中可以通过切片实现对列表或者字符串取指定范围的操作,实际就是通过对列表或者字符串通过索引进行操作. 具体细节点击廖雪峰Python教程,其中的课后小问题在此记录下 ...
- 02.ElementUI源码学习:babel配置
书接上文,接下来项目将引入babel支持ES6+语法兼容. Babel 是一个工具链,主要用于将 ECMAScript 2015+ 版本的代码转换为向后兼容的 JavaScript 语法,以便能够运行 ...
- 本地+分布式Hadoop完整搭建过程
1 概述 Hadoop在大数据技术体系中极为重要,被誉为是改变世界的7个Java项目之一(剩下6个是Junit.Eclipse.Spring.Solr.HudsonAndJenkins.Android ...
- Kubernetes删除一直处于Terminating状态的namespace
问题现象: 删除namespace,一直处于Terminating,并且用--force --grace-period=0 也删除不了 develop Terminating 4d9h Error f ...
- Day07_37_深度剖析集合中的contains()方法
深度剖析集合中的 contains()方法 contains()方法查找集合中是否包含某个元素 contains() 底层使用的是 equals()方法 当contains()方法拿到一个对象的时候, ...
- 数据结构之队列(JavaScript描述)
队列数据结构 队列遵循先进先出原则的一组有序的项.对可在尾部添加新元素并从顶部移除元素.最新添加的元素必须排在队列的末尾 队列类似栈的例子 创建队列 创建一个类表示队列 队列内应该有一些方法 添加 ...
- OSPF 综合实验
实验拓扑 实验需求 1.按照图示配置好 IP 地址,PC1 网关指向为 R8 2.OSPF 划分为 4 个区域,其中 192.168.0.0/24,192.168.1.0/24,192.168.2.0 ...
- spring boot最新版使用几个坑解决
<groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent ...
- 绕过阿里云waf进行mysql limit注入证明
朋友发了我一个站点,来看看吧,是limit注入,不太常见.搞一搞吧. POST /Member/CompanyApply/lists HTTP/1.1 Host: * Content-Length: ...