vue 解决页面刷新数据消失之localStorage

先补充下localStorage 知识点：
JS对象
读取形式：
localStorage.name
添加/修改
localStorage.name = “data”
其中"data"只能是字符串形式（目前为止只支持字符串）。所以存储时是JSON对象时需要执行下JSON.stringify，所以获取时需要执行下JSON.parse
删除
detele localStorage.name

API
获取键值对数量
localStorage.length
读取
localStorage.getItem(‘name’), localStorage.key(i)
添加/修改
localStorage.setItem(‘name’,‘xuanyuan’)
删除对应键值
localStorage.removeItem(‘name’)
删除所有数据
localStorage.clear()

顺便说下，localStorage有效期是永久的。一般的浏览器能存储的是5MB左右。sessionStorage api与localStorage相同。
sessionStorage默认的有效期是浏览器的会话时间（也就是说标签页关闭后就消失了）。
localStorage作用域是协议、主机名、端口。（理论上，不人为的删除，一直存在设备中）
sessionStorage作用域是窗口、协议、主机名、端口。

localStorage是window上的
localStorage使用有两种方法
第一种：

this.$route.query.id 是需要存储的数据
localStorage 存储数据
localStorage.data = JSON.stringify(this.$route.query.id);
localStorage 获取数据
let enterData = JSON.parse(localStorage.data);

第二种方法

//存储数据
this.$route.query.id && localStorage.setItem('data',JSON.stringify(this.$route.query.id));
//获取数据
 let enterData = JSON.parse(localStorage.getItem('data'));