Nuxt编码/解码双冒号URI

Question

bounty到期在3天内。该问题的答案有资格获得+ 100声望赏金。Begueradj正在寻找来自信誉良好的来源的答案。

我的网址上带有双冒号。

我将路径推送到其中包含：的Nuxt路由器。

  export default {
  router: {
    extendRoutes (routes, resolve) {
      routes.push({
        name: 'custom',
        path: 'towns' + '(:[0-9].*)?/',
        component: resolve(__dirname, 'pages/404.vue')
      })
    }
  }
}

例如，当我指向http://localhost:3000/towns:3时，在导致此错误消息的URL上将：转换为%3A：

Expected "1" to match ":[0-9].*", but received "%3A2"

如何将其还原为：？

我徒劳地尝试了encodeURI（），decodeURI（），encodeURIComponent（）和decodeURIComponent（）。

针对想要尝试的人的演示：nuxt-extend-routes

欢迎提出任何建议

Answer 1

Vuex使用vue-router，而vue-router使用path-to-regexp解析路由器路径配置

在我看来，您正在尝试使用没有意义的Unnamed Parameters，因为vue-router / vuex需要参数名称将其向下传递给路由后面的Vue组件

为什么不只使用命名参数？

{
      path: '/towns:id(:\\d+)',
      name: 'Page 3',
      component: Page3
    }

当然，结果是$route.params.id值将以:为前缀，并且所有router-link参数必须为:XX而不是'XX'，但这是您可以处理的。 vue-router（path-to-regexp）正在使用:来“标记”已命名的路径参数...无法解决

您可以看一下this sandbox。它不是Nuxt，但我很确定它可以以相同的方式在Nuxt中工作。...