vue清除動態(tài)路由的問題記錄
更新時間：2023年10月18日 14:47:02 作者：?﹏????
項目中往往都是添加動態(tài)路由，如何刪除已經(jīng)添加進(jìn)來的路由往往被忽視，為此這里做一下記錄，感興趣的朋友跟隨小編一起看看吧
vue清除動態(tài)路由
項目中往往都是添加動態(tài)路由，如何刪除已經(jīng)添加進(jìn)來的路由往往被忽視，為此這里做一下記錄：
查看vue-router路由文檔 可以看出 Vue2中是通過matcher來進(jìn)行重新賦值來進(jìn)行清空的。
let createRouter = () => new Router({
mode: 'history', //hash history后端支持可開,需配置nginx， 次模式下不會再返回404界面
routes: constantRouterMap, // 路由路徑
scrollBehavior: () => ({ y: 0 }) // 在切換時定位路由滾動條的位置
});
const router = createRouter()
export function resetRouter () { //清空路由的方法
const newRouter = createRouter()
router.matcher = newRouter.matcher
}
export default router;而Vue3中沒有關(guān)于matcher這個屬性，這樣一來，就需要自己通過循環(huán)遍歷來清除路由，
const router = createRouter({
routes,
history: createWebHashHistory()
})
console.log(router.getRoutes());
//重置路由
export function resetRouter(){
let routers = router.getRoutes()
console.log(routers);
routers.map((it:any)=>{
if(!whiteList.includes(it.name)){
router.removeRoute(it.name)
}
})
console.log(routers);
}** 注：whiteList是白名單，
到此這篇關(guān)于vue清除動態(tài)路由的文章就介紹到這了,更多相關(guān)vue清除動態(tài)路由內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
本篇文章主要介紹了Vue.use自定義自己的全局組件，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-06-06
本文主要介紹了iview 權(quán)限管理，iview-admin2.0自帶權(quán)限管理?？梢酝ㄟ^設(shè)置路由的meta對象的參數(shù)access來分配權(quán)限。感興趣的可以了解一下2021-07-07
Vue3 ref構(gòu)建響應(yīng)式變量失效問題及解決
這篇文章主要介紹了Vue3 ref構(gòu)建響應(yīng)式變量失效問題及解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-04-04
vue使用vue-i18n實現(xiàn)國際化的實現(xiàn)代碼
本篇文章主要介紹了vue使用vue-i18n實現(xiàn)國際化的實現(xiàn)代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-04-04
這篇文章主要為大家介紹了如何簡單實現(xiàn)vue驗證碼60秒倒計時功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-10-10
解決elementui上傳組件el-upload無法第二次上傳問題
這篇文章主要介紹了解決elementui上傳組件el-upload無法第二次上傳問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-03-03
Vue-Router如何動態(tài)更改當(dāng)前頁url query
這篇文章主要介紹了Vue-Router如何動態(tài)更改當(dāng)前頁url query問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-08-08
這篇文章主要為大家詳細(xì)介紹了Vue分頁插件的前后端配置與使用，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-10-10
本文詳細(xì)介紹了如何在Vue項目中集成和使用富文本編輯框,并分享了一些實踐經(jīng)驗,介紹了為什么需要富文本編輯框,Vue中常用的富文本編輯器,以及如何安裝、配置和使用Vue-Quill-Editor,本文還提供了一些基本的配置示例,幫助開發(fā)者在實際項目中根據(jù)需求進(jìn)行更多探索和定制2024-10-10
這篇文章主要為大家詳細(xì)介紹了如何使用Vue實現(xiàn)pdf在線預(yù)覽功能,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2025-03-03