Browse Source

feat: visited.js添加 不同tab sessionStorage同步逻辑

cuiyalong 3 years ago
parent
commit
426c9b0dc1
1 changed files with 24 additions and 8 deletions
  1. 24 8
      src/web/staticres/common-module/collection/js/visited.js

+ 24 - 8
src/web/staticres/common-module/collection/js/visited.js

@@ -3,11 +3,12 @@
 (function () {
   var syncKey = 'syncSessionStorage'
   var sessKey = 'sessionStorage'
+
   // 新打开一个tab标签页并通知其他标签页同步sessionStorage的数据到本标签页
-  // if (!sessionStorage.length) {
-  //   // 这个调用能触发storage事件,从而达到共享数据的目的
-  //   localStorage.setItem(syncKey, Date.now())
-  // }
+  if (!sessionStorage.length) {
+    // 这个调用能触发storage事件,从而达到共享数据的目的
+    localStorage.setItem(syncKey, Date.now())
+  }
 
   window.addEventListener('storage', function (e) {
     if (e.key === syncKey) {
@@ -20,6 +21,17 @@
       for (var k in data) {
         sessionStorage.setItem(k, data[k])
       }
+    } else if (e.key === 'visited-path-list') {
+      if (e.newValue) {
+        sessionStorage.setItem(e.key, e.newValue)
+      }
+      if (window.visitedPath) {
+        try {
+          window.visitedPath.init()
+        } catch (error) {}
+      } else {
+        window.visitedPath = new VisitedPath()
+      }
     }
   })
 })()
@@ -71,7 +83,7 @@ function VisitedPath () {
         }
       }
       if (this.debug) {
-        console.log(`循环了:${i + 1}次,匹配到`, list[i])
+        console.log('循环了:' + (i + 1) + '次,匹配到', list[i])
       }
     }
     return sameIndex
@@ -107,11 +119,15 @@ function VisitedPath () {
   }
 
   this.pathSave = function () {
-    sessionStorage.setItem(this.state.storageKey, JSON.stringify(this.state.visitedList))
-    localStorage.setItem(this.state.storageKey, Date.now())
+    var listStr = JSON.stringify(this.state.visitedList)
+    sessionStorage.setItem(this.state.storageKey, listStr)
+
+    // 触发storage事件中的数据同步逻辑(同步数据到其他标签)
+    localStorage.setItem(this.state.storageKey, listStr)
+    localStorage.removeItem(this.state.storageKey)
   }
 
   this.init()
 }
 
-var visitedPath = new VisitedPath()
+window.visitedPath = new VisitedPath()