Vue本地存储

最新推荐文章于 2024-07-30 14:19:19 发布

小小的毛驴

最新推荐文章于 2024-07-30 14:19:19 发布

阅读量6k

点赞数 1

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/hao15239983881/article/details/122299638

版权

本文介绍了Vue中本地存储的原理与应用场景，包括Local Storage的使用方式，如存储、获取、删除数据，并通过实际例子展示了如何利用Local Storage进行数据持久化。重点讲述了在前端开发中，如何利用Local Storage进行用户配置、缓存数据等操作。

摘要由CSDN通过智能技术生成

【1】本地存储是什么
以文件的方式存储在本地，通过把数据存在浏览器中，用户不必每次都向服务器请求
获取同一个信息。在你离线时，使用本地存储的数据而不是向远端服务器上请求
数据就显得非常有用，甚至在先用户也可以从中获益。客户端存储可以通过这些
技术来实现：cookie、Local、Storage(更准确的说是“Web Storage”)
ImdexedDB和WebSQL(这项技术已经被废弃了，你不应该在新项目中使用它)。
这个cookbook的条目中，我们将专注于最简单的存储机制：Local Storage。Local
Storange使用键/值对来存储数据，他权支持存储简单的值，但也可以通过JSON
编解码来存储复杂数据。总体来说，Local Storage适合存储你希望进行持久化的
小数剧集，比如用户编好设置或表便数据。更大规模和复杂数据则适合存储在
IndexdDB 中

【2】本地存储的应用场景
localstorage是保存在本地存储量比较大而且不会被销毁，有时候做一些跨域
操作cookie无法使用这个来做或者缓存一些不需要提交到服务器的数据比如
我有一个弹窗需要谈一天弹一次这种记录就可以用localstorange

【3】
1 存储数据
localStorage.setltem('accessToken','Bearer'+response.data.result.accessToken)
2 取出数据
ocalStorage.getltem('accessToken')

3 删除存储数据
ocalStorage.removeltem('accessToken')

4 更改数据
localStorage.s