专栏首页web前端技术分享vuex存储和本地存储(localstorage、sessionstorage)的区别

vuex存储和本地存储(localstorage、sessionstorage)的区别

区别及适用场景

1.区别:vuex存储在内存,localstorage(本地存储)则以文件的方式存储在本地,永久保存;sessionstorage( 会话存储 ) ,临时保存。localStorage和sessionStorage只能存储字符串类型,对于复杂的对象可以使用ECMAScript提供的JSON对象的stringify和parse来处理。

2.应用场景:vuex用于组件之间的传值,localstorage则主要用于不同页面之间的传值。

3.永久性:当刷新页面时vuex存储的值会丢失,localstorage不会。注:很多同学觉得用localstorage可以代替vuex, 对于不变的数据确实可以,但是当两个组件共用一个数据源(对象或数组)时,如果其中一个组件改变了该数据源,希望另一个组件响应该变化时,localstorage无法做到响应式,vuex可以绑定数据响应式。

Vuex数据状态持久化的使用场景

1、购物车 比如你把商品加入购物车后,没有保存到后台的情况下,前端来存,就可以通过这种方式vuex+localStorage(sessionStorage)。

2、会话状态 授权登录后,token就可以用Vuex+localStorage(sessionStorage)来存储。

3、一些不会经常改变的数据 比如城市列表等(当前也要留下可以更新的入口,比如版本号)

小提示:localStorage.setItem(key, String), set的值必须是字符串,如果你的数据是对象都需要先行转换(JSON.stringify(xxx)),取出时localStorage.getItem(key),取出后的字符串可以通过JSON.parse(xxx)转回对象。

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

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 本地存储常用方式 localStorage, sessionStorage,cookie 的区别 和 服务器存储session

    本地存储:把一些信息存储到客户端本地(主要目的有很多,其中有一个就是实现多页面之间的信息共享)

    TimothyJia
  • js中clientWidth, scrollWidth, innerWidth, outerWidth和offsetWidth属性的区别

    一、测试1:无滚动条时,dom对象的offsetWidth、clientWidth和scrollWidth

    TimothyJia
  • Node基础-CommonJS模块化规范

    =>开发一个项目,我们生成一个配置清单“package.json”,当我们安装第三方模块使用的时候,把安装的模块信息记录到配置清单中,这样以后不管是团队协作开发...

    TimothyJia
  • Git分支管理

    Svn中也有分支管理,但是很low,Git的分支管理非常强大,本文先不去说分支管理内部到底怎么做的,我们先来看看Git中最基本的分支管理操作。 本文是Git系列...

    江南一点雨
  • FAA不同意无人机送货,亚马逊哭了,京东笑了…

    近日,美国联邦航空管理局FAA颁布了首部专门针对小型无人机的管理法则“Part107” ,并将于8月末生效。“Part107”适用于在美国领空内飞行的,重量低于...

    机器人网
  • 无人机、无人车与机器人,未来谁更适合当快递员?

    镁客网
  • 微信开放文档是个病,得治!

    以前,微信开放文档是使用文档界的老大哥— gitbook。用它搭建文档其实并不需要耗费多长时间,主要在于界面维护和自定义主题。Jquery 则是里面主要用来做前...

    villainhr
  • TensorFlow强化学习入门(5)—— 可视化Agent的“所思所想”

    在我的强化学习系列的文章中,我想要深入探究我们基于神经网络的agent在训练过程中习得的表达形式。尽管我们的直接目的是希望我们的agent能够获得更高的分数,或...

    ArrayZoneYour
  • 又有一个机器人死在福岛核电站,辐射水平高到创纪录

    量子位 | 若朴 编译整理 ? 又有一个试图定位和清除放射性燃料的机器人,“死”在日本福岛核反应堆的深处。这是两个星期以来,第二个留在福岛核电站再也回不来的机器...

    量子位
  • SAN存储向分布式Server存储的演进

    在目前的私有云中,大部分小型云喜欢使用FC-SAN,主要原因是性能好、架构简单、小规模环境投资小。但随着视频等业务的出现,采用FC-SAN难以保...

    希望的田野

扫码关注云+社区

领取腾讯云代金券