vue.data页面级暂存实现
大家看这个demo哈
我想实现一个效果
就是把这个页面
所有的状态都暂存起来
包括这个页面下面可能还有一个
分页的表格
所以呢表格的数据啊
包括表格翻到第几页都能暂存起来
然后在刷新的时候呢
这个数据依然存在
所以呢用 keep-alive 就实现不了
那
我就想
能不能在这个暂存的点击事件里
用 this.$data 来获取到这个 vue（组件）
所有的data数据以后呢
把整个这个data数据都存起来
比如说我们存到 localStorage 哈
点 set attempt
然后起个名字就叫 stash
然后呢把它做一个四驱范对
把这个给他
这样就能存起来了
但我遇到一个什么问题呢
就是把它 data 读取出来没问题
问题是往里放有问题
就是这个 $data 属性
它是一个只读的
除非我们
遍历它里面子属性一个一个往里放
但这样就太麻烦了
那这个具体的报错呢我就不演示了哈
总之他就放不进去
后来呢我就发现
其实这个data()就是一个方法
在这return一个结果
所以我们可以直接在这去
比如说我们直接在这 localStorage 这点 get it
叫stash
然后呢把它放到一个变量 里
我们叫：stashStr
然后呢
把它转成json
就这样然后在这return的地方呢
我们稍微改一下
用Object.assign
原来的这个还放在这
只不过呢我们在这加一个
stash 的对象
好我们再来试一下哈
比如编辑一下随便都编辑一下
好然后暂存
然后刷新
大家看这就可以了
包括如果这个页面还有表格
翻页什么这都没问题
最后更新于