vue路由器如何使用动态参数要求匹配？

Question

我在路由器中定义了一个动态参数。此参数即使是动态的，也会接收某些参数值。

示例：

{
  path: '/:type',
  component: List,
}

路由器可以使用2或3个参数。例如，它可以采用的参数是“实际”和“存档”

当用户键入“：// localhost：8080 / 实际”或“：// localhost：8080 / 存档”。我可以在.vue文件中执行此操作，但是我想在路由器文件中进行调整。

Answer 1

您可以在路由配置本身上设置Per-Route Guard

{
  path: '/:type',
  component: List,
  beforeEnter: (to, from, next) => {
    //check the params
    if(to.params.type === 'actual' ||to.params.type === 'archive'){
      next();
    }else{
      next('/404');//error route
    }
  }
}