VUE本地存储

1.本地储存是什么？

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

2.本地储存的应用场景

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

3.语法

(1).储存数据
localStorage.setItem(‘accessToken’, 'Bearer ’ + response.data.result.accessToken)
(2).取出数据
localStorage.getItem(‘accessToken’)

(3).删除储存数据
localStorage.removeItem(‘accessToken’)
(4).更改数据
localStorage.setItem(‘accessToken’, ‘更改后’ + response.data.result.accessToken)

4.例子练习
首先是页面布局，通过双向数据绑定来获取input框的值，再将数据存储到对象里，将对象通过本地存储，存储起来，再取出，取出之后，定义一个空的数组，将对象添加到数组里，之后再将数组存储起来。代码如下

之后的话需要在登录页面来拿到数组，再判断是否和输入的一致，代码如下：