vueRouter重置路由

duanyuehuan2025-12-28 8:40

1.v3

javascript 复制代码

import VueRouter from 'vue-router'

// 假设 constantRoutes 是你的基础静态路由
import { constantRoutes } from './routes'

export function resetRouter() {
  const freshRouter = new VueRouter({ mode: 'history', routes: constantRoutes })
  router.matcher = freshRouter.matcher // 替换 matcher，达到重置目的
}

2.v4

javascript 复制代码

import { createRouter, createWebHistory } from 'vue-router'
const resetRouter = () => {
  const newRouter = createRouter({ history: createWebHistory(), routes: [...] })
  router.matcher = newRouter.matcher
}

v4 提供了单条路由的删减api

javascript 复制代码

import { createRouter, createWebHistory } from 'vue-router'
import router from './router'
import constantRoutes from './constantRoutes'

export const resetRouter = () => {
  router.getRoutes().forEach(r => router.removeRoute(r.name))

  // 视需要补齐静态基础路由
  constantRoutes.forEach(r => {
    if (!router.hasRoute(r.name)) router.addRoute(r)
  })
}