Bootstrap

Vue3 + vueRouter4.x 控制台No match found for location with path ‘/home‘ 解决

首先你要排除你的路由没有以下问题

  • name重复
  • 嵌套路由子路由多了’/’

话不多说直接上思路及解决方案

问题: 动态加载路由router.addRoute(xx); 进入目标页面, 控制台报警告:No match found for location with path "/home"
原因: 当前路由为根据权限动态添加的, 所以beforeEach第一次执行的时候, 当前路由还没追加进去, 就会报这个警告

解决方案:

在默认路由中添加下面代码即可

	const constantRoutes = [
	    {
	        path: '/:catchAll(.*)',
	        component: () => import('@/views/error/404.vue'),
	    },
	];
	const router = createRouter({
	    history: createWebHistory(),
	    routes
	})
;