Переглянути джерело

Merge pull request #195 from Nicole0724/master

add:用户刷新浏览器后,系统tab 丢失问题处理;刷新前先缓存tab
wenjianzhang 3 роки тому
батько
коміт
0f3cd41652
1 змінених файлів з 25 додано та 1 видалено
  1. 25 1
      src/layout/components/TagsView/index.vue

+ 25 - 1
src/layout/components/TagsView/index.vue

@@ -73,9 +73,33 @@ export default {
   mounted() {
     this.initTags()
     this.addTags()
-    this.isActive()
+    this.beforeUnload()
   },
   methods: {
+    // 刷新前缓存tab
+    beforeUnload() {
+      // 监听页面刷新
+      window.addEventListener('beforeunload', () => {
+        const tabViews = this.visitedViews.map(item => {
+          return {
+            fullPath: item.fullPath,
+            hash: item.hash,
+            meta: { ...item.meta },
+            name: item.name,
+            params: { ...item.params },
+            path: item.path,
+            query: { ...item.query },
+            title: item.title
+          }
+        })
+        sessionStorage.setItem('tabViews', JSON.stringify(tabViews))
+      })
+      // 页面初始化加载判断缓存中是否有数据
+      const oldViews = JSON.parse(sessionStorage.getItem('tabViews')) || []
+      if (oldViews.length > 0) {
+        this.$store.state.tagsView.visitedViews = oldViews
+      }
+    },
     handleTagsOver(index) {
       const tags = document.querySelectorAll('.tags-item')
       const item = tags[index - 1]