Vue 關閉當前頁、關閉當前標簽tagsView的實現(xiàn)方法
更新時間:2022年08月09日 11:47:38 作者:菜鳥學編程
這篇文章主要介紹了Vue 關閉當前頁、關閉當前標簽tagsView,主要有兩種方式,一種是在vue頁面直接實現(xiàn),另一種在js文件中寫自定義函數,在vue頁面中調用,本文通過實例代碼介紹的非常詳細,需要的朋友可以參考下
由于項目使用tagsView,關閉當前頁面需要通過關閉當前標簽來實現(xiàn)
涉及到幾個點:
1. 移除 VisitedView 和 CachedView 中的當前項
2. 跳轉到最后一次訪問的標簽
主要思路:比對 路由路徑 ( this.$route.path)
兩種方式:
一、 在vue頁面直接實現(xiàn)
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'
// 關閉當前頁 關聯(lián)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的文章就介紹到這了,更多相關Vue 關閉當前頁內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
Vue2.0使用嵌套路由實現(xiàn)頁面內容切換/公用一級菜單控制頁面內容切換(推薦)
這篇文章主要介紹了Vue2.0使用嵌套路由實現(xiàn)頁面內容切換/公用一級菜單控制頁面內容切換,本文給大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友可以參考下2019-05-05
element中TimePicker時間選擇器禁用部分時間(顯示禁用到分鐘)
這篇文章主要介紹了element中TimePicker時間選擇器禁用部分時間(顯示禁用到分鐘),文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2021-03-03
Vue+WebSocket頁面實時刷新長連接的實現(xiàn)
最近vue項目要做數據實時刷新,數據較大,會出現(xiàn)卡死情況,所以本文主要介紹了頁面實時刷新長連接,具有一定的參考價值,感興趣的小伙伴們可以參考一下2021-06-06

