做一个多页面项目,一般会加一个404页面。

问题

router中设置匹配404规则,但是没有生效

new Router({
	mode: 'history',
	routes: [{
		path: '/',
		name: 'layout',
		component: Layout,
		redirect: '/home',
		children: [{
				path: '/home',
				component: Home,
				name: 'home'
			}]
    }]
  }, {
		path: '*',
		component: 404,
	}]
});
this.$router.push({
	name: 'number111',
});

分析

没有效果可能没设置成这样

{
	path: '*',
	name: '*',
	component: 404,
}

尝试之后,发现没有解决,那应该是使用路由守卫了

Routes.beforeEach((to, from, next) => {
  if (to.matched.length !== 0) {
    next()
  } else {
    next({ path: '/404' })
  }
});

建议

  • 不使用路由守卫,建议路由跳转不使用name
  • 使用路由守卫处理404
Logo

前往低代码交流专区

更多推荐