vue实时监听 localStorage 变化
应用场景：
1、页面B需要实时获取页面A数据更改
2、父子页面之间的传参
代码实例
B页面实时获取A页面的数据变化
在【页面A】进行缓存修改or插入缓存
localStorage.setItem('product_process_uid', parentinputname + '#' + data.uid + '#' + data.nickname);
在【页面B】需要监听缓存值更改
mounted: function () {
var that = this;
//监听 localStorage 缓存中指定key的值变化,本例key为 product_process_uid
window.addEventListener('storage', function (e) {
if (e.key && e.key == 'product_process_uid' && e.newValue) {
that.product_process_uid = e.newValue;
// 监听到值后的处理逻辑
that.product_process_uid = that.product_process_uid.split('#');
that.formData.product_process[that.product_process_uid[0]].user_id = that.product_process_uid[1];
that.formData.product_process[that.product_process_uid[0]].user_name = that.product_process_uid[2];
// 根据实际情况，判断处理完后是否要删除这个key
localStorage.removeItem('product_process_uid');
}
})
}
如上即可在【页面B】实时获取到【页面A】中的数据。
注意
页面必须是同源（即同一个域名，例如：都在https://www.baidu.com/域名下）
参考文档：
https://blog.csdn.net/qq_38902230/article/details/110233216
————————————————
原文作者：木偶
转自链接：https://www.muouseo.com/article/rpnv35ewm5.html
版权声明：著作权归作者所有。商业转载请联系作者获得授权，非商业转载请保留以上作者信息和原文链接。
