Vue如何關閉當前頁、關閉當前標簽tagsView

這篇文章主要介紹“Vue如何關閉當前頁、關閉當前標簽tagsView”的相關知識，小編通過實際案例向大家展示操作過程，操作方法簡單快捷，實用性強，希望這篇“Vue如何關閉當前頁、關閉當前標簽tagsView”文章能幫助大家解決問題。

由于項目使用tagsView,關閉當前頁面需要通過關閉當前標簽來實現 

涉及到幾個點：

1. 移除 VisitedView 和 CachedView 中的當前項

2. 跳轉到最后一次訪問的標簽

主要思路：比對 路由路徑 ( this.$route.path)

兩種方式：

一、 在vue頁面直接實現

closePage()
      var currentView = this.$store.state.tagsView.visitedViews[0]
      for (currentView of this.$store.state.tagsView.visitedViews) {
        if (currentView.path === this.$route.path) {
          break
        }
      }
      this.$store.dispatch('tagsView/delView', currentView)
        .then(({ visitedViews }) => {
          if (currentView.path === this.$route.path) {
            const latestView = this.$store.state.tagsView.visitedViews.slice(-1)[0]
            if (latestView) {
              this.$router.push(latestView)
            } else {
              // 如果沒有其他標簽則跳轉到首頁
              if (currentView.name === '首頁') {
                this.$router.replace({ path: '/redirect' + currentView.fullPath })
              } else {
                this.$router.push('/')
              }
            }
          }
        })

二、在js文件中寫自定義函數，在vue頁面中調用

import router from '@/router/routers'
 
// 關閉當前頁 關聯tagView
export function closePage(store, route) {
  var currentView = store.state.tagsView.visitedViews[0]
  for (currentView of store.state.tagsView.visitedViews) {
    if (currentView.path === route.path) {
      break
    }
  }
  store.dispatch('tagsView/delView', currentView)
    .then(({ visitedViews }) => {
      if (currentView.path === route.path) {
        const latestView = store.state.tagsView.visitedViews.slice(-1)[0]
        if (latestView) {
          router.push(latestView)
        } else {
          if (currentView.name === '首頁') {
            router.replace({ path: '/redirect' + currentView.fullPath })
          } else {
            router.push('/')
          }
        }
      }
    })
}

關于“Vue如何關閉當前頁、關閉當前標簽tagsView”的內容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業相關的知識，可以關注億速云行業資訊頻道，小編每天都會為大家更新不同的知識點。