vue清除动态路由的问题记录
更新时间：2023年10月18日 14:47:02 作者：✎﹏ℳ๓₯㎕
项目中往往都是添加动态路由，如何删除已经添加进来的路由往往被忽视，为此这里做一下记录，感兴趣的朋友跟随小编一起看看吧
vue清除动态路由
项目中往往都是添加动态路由，如何删除已经添加进来的路由往往被忽视，为此这里做一下记录：
查看vue-router路由文档 可以看出 Vue2中是通过matcher来进行重新赋值来进行清空的。
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中没有关于matcher这个属性，这样一来，就需要自己通过循环遍历来清除路由，
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是白名单，
到此这篇关于vue清除动态路由的文章就介绍到这了,更多相关vue清除动态路由内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
methods是如何绑定this的 methods绑定上下文执行环境是通过bind来进行的呢,本文给大家介绍Vue中methods实现原理是什么,感兴趣的朋友一起看看吧2023-11-11
这篇文章主要介绍了Antd的table组件表格的序号自增操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-10-10
这篇文章主要介绍了手写 Vue3 响应式系统(核心就一个数据结构),响应式就是被观察的数据变化的时候做一系列联动处理。就像一个社会热点事件，当它有消息更新的时候，各方媒体都会跟进做相关报道。这里社会热点事件就是被观察的目标2022-06-06
vue组件数据传递、父子组件数据获取，slot,router路由功能示例
这篇文章主要介绍了vue组件数据传递、父子组件数据获取，slot,router路由功能,结合实例形式分析了vue.js组件数据传递、路由相关概念、原理及相关操作技巧,需要的朋友可以参考下2019-03-03
这篇文章主要给大家介绍了关于Vue开发中常见的套路和技巧的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-11-11
这篇文章主要介绍了vue3之向echarts组件传值的问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-03-03
vue3+ts+vite使用el-table表格渲染记录重复情况
这篇文章主要给大家介绍了关于vue3+ts+vite使用el-table表格渲染记录重复情况的相关资料,我们可以通过合并渲染、数据缓存或虚拟化等技术来减少重复渲染的次数,文中通过代码介绍的非常详细,需要的朋友可以参考下2023-12-12
ExcelJS是一个用于在Node.js和浏览器中创建、读取和修改Excel文件的强大JavaScript库,下面这篇文章主要给大家介绍了关于vue2项目使用exceljs多表头导出功能的相关资料,需要的朋友可以参考下2024-05-05
这篇文章主要为大家介绍了Vue编译器AST抽象语法树源码分析详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-07-07
这篇文章主要为大家详细介绍了Vue3如何结合Vite4对项目进行性能优化的相关配置,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下2025-04-04
最新评论