vuex、localStorage、sessionStorage 存储区别

简介: vuex、localStorage、sessionStorage 存储区别

vuex

  • vue 自带数据储存插件,Vuex 解决了多视图之间的数据共享问题。但是运用过程中又带来了一个新的问题是,Vuex 的状态存储并不能持久化。也就是说当你存储在 Vuex 中的 store 里的数据,只要一刷新页面,数据就丢失了。
  • 可以引入 vuex-persist 插件,它就是为 Vuex 持久化存储而生的一个插件。不需要你手动存取 storage ,而是直接将状态保存至 cookie 或者 localStorage 中。

localStorage

  • 生命周期是永久,这意味着除非用户显示在浏览器提供的UI上清除 localStorage 信息,否则这些信息将永远存在。

sessionStorage

  • 生命周期为当前窗口或标签页,一旦窗口或标签页被永久关闭了,那么所有通过 sessionStorage 存储的数据也就被清空了。

Vue.ls

  • 用于从Vue上下文中使用本地存储,会话存储和内存存储,存储位置可配 (session, local, memory)

其他相关资料

相关文章
|
7月前
|
存储
存储对象sessionStorage与localStorage
存储对象sessionStorage与localStorage
63 0
|
3月前
|
存储 移动开发 HTML5
SessionStorage 和 LocalStorage 有什么区别?
SessionStorage 和 LocalStorage 有什么区别?
239 3
|
2月前
|
存储 JavaScript 前端开发
vuex和localstorage . cookie的区别
【10月更文挑战第8天】
60 1
|
2月前
|
存储 数据管理 数据安全/隐私保护
Vuex 和 LocalStorage 实现数据共享
【10月更文挑战第8天】
55 1
|
4月前
|
存储 JavaScript 前端开发
学习vuex和localstorage . cookie的作用与区别
探讨Vuex、LocalStorage与Cookie:三种关键技术在现代Web开发中的角色。Vuex作为Vue的状态管理工具,提供集中、响应式且可预测的状态变更机制,适用于复杂应用。LocalStorage为客户端提供大容量、持久化的数据存储方案,适合保存用户偏好等静态信息。Cookie则擅长会话跟踪与认证管理,数据虽小却能在客户端与服务器间传递。每种技术针对不同场景各有优势,合理选用是关键。
|
5月前
|
存储 Web App开发 移动开发
js【详解】本地存储 Cookie、sessionStorage、localStorage
js【详解】本地存储 Cookie、sessionStorage、localStorage
158 0
|
7月前
|
存储 缓存 前端开发
localStorage
localStorage 是一种浏览器本地存储技术,它可以在用户浏览器中存储数据,包括文本、图像、文件等等。相比于会话存储(sessionStorage),localStorage 的存储时间更长,可以跨多个会话保持数据。因此,localStorage 常常用于存储一些长时间需要保留的数据,例如用户设置、偏好、登录状态等等。 使用 localStorag
83 8
|
7月前
|
存储 JSON 数据格式
localStorage和sessionStorage的使用和区别
localStorage和sessionStorage的使用和区别
77 0
localStorage和sessionStorage的使用和区别
|
存储 JavaScript 前端开发
js本地存储localStorage和sessionStorage
js本地存储localStorage和sessionStorage
|
存储 缓存 前端开发
前端存储之sessionStorage和localStorage
前端存储之sessionStorage和localStorage
298 0