最近在做项目的时候需要监听localstorage的变化,使用默认的storage事件发现无效,从网上找到一种解决办法,这个方案重写了Localstorage事件,只要发生变化就会触发定义的方法,刚好能满足需求,代码如下供参考。
index.vue
created() {\n\n// window.addEventListener("storage",aaa)\n\nobj.render(function(d){\n\ndebugger\n\n});\n\n},index.js
let obj = {\n _cb: null,\n render(cb) {\n this._cb = cb\n this.addEvent(cb)\n // localStorage.setItem("PageEngineFormInputData", 123)\n },\n addEvent(cb) {\n var orignalSetItem = localStorage.setItem;\n\n localStorage.setItem = function (key, newValue) {\n var setItemEvent = new Event(cb);\n\n setItemEvent.newValue = newValue;\n setItemEvent.newValuekey = key;\n\n window.dispatchEvent(setItemEvent);\n\n orignalSetItem.apply(this, arguments);\n };\n\n window.addEventListener(cb, function (e) {\n // debugger\n console.log("newValue:", e.newValue);\n console.log("key:", e.newValuekey);\n if (cb && e.newValuekey === 'PageEngineFormInputData') {\n cb(e.newValue)\n }\n });\n }\n}\nexport default obj