vue本地存储
㈠ vue本页面存本页面取可以吗
是可以的，安装一个插件即可实现。插件参数如下：
// 命名的路由
router.push({ name: 'user', params: { userId: 123 }})
// 带查询参数，变成 /register?plan=private
router.push({ path: 'register', query: { plan: 'private' }})
实现本页面存和取的原理为：
这是提供一个 栈 来达到管理栈内所有页面参数的效果。在页面入栈的时候，系统会将当前页面的参数存储起来，在下一个页面点击返回按钮回到当前页面的时候我们再从参数栈恢复参数，从而实现vue本页面的存和取。
㈡ vue打包无法存储token
Vue打包无法存储token是指Vue应用在打包后无法持久保存认证凭据，这是因为Vue使用了浏览器的localStorage，在应用编译后会被清除。为了解决该问题，可以使用HTML5 Web Storage API将token存储在本地，或者在编译时将token放入到应用中，并在每次加载时获取token进行认证。
㈢ vue项目网上购物系统数据库作用
有路由拦截、数据获取等作用。
vue项目网上购物系统数据库可以进行路由拦截、数据获取、本地储存的作用，充分保证了系统代码的良好可读性、实用性。
网上购物数据库系统（DBMS）是建立在操作系统之上的数据库系统，它是指使用最广泛的应用程序和数据库系统，其主要功能是管理用户以及控制系统的访问权限，也是网站数据库的核心部分。
㈣ vue项目数据本地存储
缓存存入：
localStorage.setItem("token", this.token);
localStorage.setItem('formValidate', JSON.stringify(this.formValidate)) （对象）
缓存取出：
this.token=localStorage.getItem("token");
var object = JSON.parse(localStorage.getItem('formValidate')) （对象）
缓存情空：
localStorage.setItem("token", this.token);
window.localStorage.clear()
㈤ vue中使用localStorage存储信息
JSON。parse()作用是将字符串转化成json数组，JSON.stringify()作用是将json数组转换成字符串
对浏览器来说，使用Web Storage存储键值对比存储Cookie方式更直观，而且容量更大，它包含两种：localStorage和sessionStorage
所以上次使用cookie的时候就遇到了一个坑，设置后马上访问session会获取不到，蛋痛，还需要刷新一下，原因是：
当我们首次访问设置Cookie的页面是，服务器会把设置的Cookie值通过响应头送过来，告诉浏览器将cookie存储的本地相应文件夹中(注意：第一次访问时本地还没有存储Cookie，所以此时获取不到值)；
当第二次访问时（或是进行cookie设置后，过期前所有的访问）时，请求头信息中你都会把Cookie值携带。
localStorage有效期是永久的。一般的浏览器能存储的是5MB左右。sessionStorage api与localStorage相同。
sessionStorage默认的有效期是浏览器的会话时间（也就是说标签页关闭后就消失了）。
localStorage作用域是协议、主机名、端口。（理论上，不人为的删除，一直存在设备中）
sessionStorage作用域是窗口、协议、主机名、端口。
知道了这些知识点后，你的问题就很好解决了。
localStorage是window上的。所以不需要写this.localStorage，vue中如果写this，是指vue实例。会报错
㈥ Vue 刷新网页后 vuex 的 state 数据丢失的解决方案
原因很简单，因为 store 里的数据是保存在运行内存中的,当页面刷新时，页面会重新加载 Vue 实例， store 里面的数据就会被重新赋值。
一般情况下有两种解决方案
(a). state 里的数据全部是通过请求来触发 action 或 mutation 来改变
(b). 将 state 里的数据保存一份到本地存储(localStorage、sessionStorage、cookie）中
很显然，第一种方案基本不可行，除非项目很小或者vuex存储的数据很少。
而第二种可以保证刷新页面数据不丢失且易于读取。
首先我们看一下有几种 存储 , 然后选择合适的客户端存储:
localStorage 是永久存储在本地，除非你主动去删除;
sessionStorage 是存储到当前页面关闭为止;
cookie 则根据你设置的有效时间来存储，但缺点是不能储存大数据且不易读取。
我选择的是 sessionStorage , 因为 Vue 是单页面应用，操作都是在一个页面跳转路由，另一个原因是 sessionStorage 可以保证打开页面时 sessionStorage 的数据为空，而如果是 localStorage 则会读取上一次打开页面的数据。
第一种方案
由于state里的数据是响应式，所以sessionStorage存储也要跟随变化。
再者vuex规定所有state里数据必须通过mutation方法来修改，
所以第一种方案就是mutation修改state的同时修改sessionStorage对应存储的属性
第二种方案
第一种方案确实可以解决问题，但这种方法很明显让人觉得怪异，不如直接用 sessionStorage 来做状态管理更简单些。那问题来了, 怎么才能不用每次修改 state 时同时也要修改 sessionStorage 呢？
这时 beforeunload 可以为我们很好的解决这个问题, 它是在页面刷新时先触发的。并放在 app.vue 这个入口组件中，这样就可以保证每次刷新页面都可以触发。如下:
㈦ vue3.0 监听本地存储
1. 现在main.js中注册全局方法，比如要监听的本地储存key值为‘changeData’
Vue.prototype.resetSetItem = function (key, newVal) {
if (key === 'changData') {
// 创建一个StorageEvent事件
var newStorageEvent = document.createEvent('StorageEvent');
const storage = {
setItem: function (k, val) {
sessionStorage.setItem(k, val);
// 初始化创建的事件
newStorageEvent.initStorageEvent('setItem', false, false, k, null, val, null, null);
// 派发对象
window.dispatchEvent(newStorageEvent)
}
}
return storage.setItem(key, newVal);
}
}
2 如何触发
在一个路由(比如路由A)存储值得时候，使用下面的方法：
this.resetSetItem('changeData',this.value);
3、如何监听
如果在另外一个路由(比如路由B)中，我们想根据changeData的变化来请求接口刷新页面数据的时候，可以在这个路由中created钩子函数中监听
window.addEventListener('setItem', ()=> {
this.newVal = sessionStorage.getItem('changeData');
})
㈧ Vuex 刷新页面后数据就消失了，怎么保存数据持久化
1 .如果想让某些数据页面刷新之后不消失，那就可以结合本地存储做到数据持久化
2 .比如之前的搜索记录，还有一些需要依赖的数据。比如本次活动的代号存下来，让我在一段时间内，根据这个编号来确定相关代号代表的一批数据可以缓存在本地，一遍在下一次请求的时候快速返回
3 .实现原理：在mutations定义的方法里对vuex的状态操作的同时对存储也做相应的操作
4 .插件vue-savedata，vuex-persistedstate
5 .实际实现:监听浏览器的刷新，刷新之前把vuex存在本地，在路由拦截处获取本地储存，放进vuex并删除本地存储，可以自由控制存localstorage和sessionStorage，完全避免插件来消耗性能。
6 .不同页面之间的数据传值，vuex适合组件间传值。
7 .有的问题研究一分钟和一个小时，是会发现不同的问题。
1 .vuex存储在内存。localstorage则以文件的方式存储在本地
2 .应用场景：vuex用于组件之间的传值，localstorage则用于不同页面之间的传值
3 .永久性：当刷新页面时vuex存储的值会丢失。localStorage不会删除
4 .localstorage:只能进行简单的数据读写，对不同组件之间读取数据并做数据转化时，需要对每个读写操作都写一遍代码,重点是存放
5 .vuex是状态管理，重点是管理数据，一个是数据容器，一个是数据管理器。
下列选项（默认保存store中的每个数据到本地 ）
可以为您的特定需求配置插件: (参数都是可选的：有默认值)
1.store/index.js
㈨ Vue中存储数据方法：localStorage、sessionStorage和Vuex的区别和简单使用
localStorage和sessionStorage都是通过键值对的方式进行存储，用于不同页面之间传值 （注意：它们都只接受存储字符串类型的数据，若遇到json格式的数据需要使用JSON.stringify()将数据转化为字符串类型） ，区别在于：
1、sessionStorage：用于短期存储，当浏览器关闭之后sessionStorage中存储的数据就会被清除，浏览器不关闭仅关闭网页数据不删除。
2、localStorage：用于长期存储，当浏览器关闭之后localStorage存储的内容不会被清除，数据一直存储在本地。
vuex常被用于两个组件进行数据交互时，如一个组件修改了某一个数据，需要另一个组件也同步这个更改，而localStorage和sessionStorage无法同步更改，这时就需要使用vuex来达到这个目的。