本地存储实时监听

实时监听本地存储

• @param { number } type 1 localStorage 2 sessionStorage
• @param { string } key 键
• @param { string } data 要存储的数据

首先在main.js中修改了本地存储的存储方式

Vue.prototype.$addStorageEvent = function (type, key, data) {
    if (type === 1) {
        // 创建一个StorageEvent事件
        const storage = {
            setItem: function (k, val) {
                localStorage.setItem(k, val)
                // 初始化创建的事件
                newStorageEvent.initStorageEvent('setItem', false, false, k, null, val, null, null)
                // 派发对象
                window.dispatchEvent(newStorageEvent)
            }
        }
        return storage.setItem(key, data)
    } else {
        // 创建一个StorageEvent事件
        // eslint-disable-next-line no-redeclare
        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, data)
    }
}
        }
            this.$store.replaceState(Object.assign({}, this.$store.state, JSON.parse(localStorage.getItem('本地存储中的数据'))))
if (localStorage.getItem('本地存储中的数据')) {
---加入了vuex
但是发现这样并不可以使用

        })

        })
            ‘要改变的数据’ = e.newValue  ---  newvalue是storage的一个属性
window.addEventListener('setItem', (e) => {
在需要监听的公共组件中：
-----------------------------------

this.$addStorageEvent(1, 'shopnum', JSON.stringify(this.sum))
在需要存储数据的时候使用：
-----------------------------------
window.addEventListener('setItem',(e)=>{
	this.XXX() //请求
})
}