页面跳转,页面缓存

在写项目的过程中,有些需求使页面进行跳转(并且将该页面缓存下来),再次返回该页面的时候,需要原来的页面再次还原.所以解决思路就是:使用浏览器存储将data数据存在浏览器中,当满足一定的条件的时候再将数据调出来,就可以实现页面跳转,原页面数据不变的情况
建议:最好使用sessionStorage,因为它可以在浏览器关闭的时候自动清楚缓存,当然也可以在需要的时候手动清除(sessionStorage.clear()即可 ).
常见的几种浏览器存储方式:

1. Cookie(主要用作状态存储,保存在服务端)
2. session(和Cookie一样用于扩张,保存在服务端)
3. Web storage API （localStorage、sessionStorage）(会用到它所以重点讲)

相关的api如下

实现步骤:

1.页面跳转的时候调用 sessionStorage.setItem(‘data’,JSON.stringify(this.$data)) 将data的数据都存在浏览器中,
2.当页面挂载的时候,在mounted函数中获取数据 let data = JSON.parse(sessionStorage.getItem(‘data’))
Object.assign(this, data) ,不要写在created中,不要问为什么,
3.另外在添加一个前置路由守卫,如果跳转路径并不是你想跳的路径直接调用sessionStorage.clear() 清除浏览器数据

关于浏览器存储的区别了解更多推荐的博客:https://blog.csdn.net/m0_65335111/article/details/127520150