Question

我正在多页应用程序上使用vue-router；我们之所以要添加历史记录模式，是因为我们的要求是我们的网址坚持不包含特殊字符（＃），并希望从前端代码中确保我们始终在客户端路由的前面加上/v/。（以避免在整个应用程序中更新我们的所有路线，并集中此功能）。

我想添加一条类似于以下路线：

routes: [
    // add `v/` to paths that don't start with `v/`
    { 
      path: `(^\/(?!v))*`, 
      redirect: to => `/v/${to}` 
    },
]

基于在path-to-regexp中使用正则表达式，但是我从他们的文档中并未完全清楚如何正确地将整个路径作为正则表达式传递（或者可能吗？），尤其是在没有陷入重定向的情况下循环。

Answer 1

我能够使用2次重定向来实现所需的功能（在这种情况下，它会以404的形式退回到'/'。

// Fallback to baseRoute for prefixed unmatched routes
{ path: `${prefix}/*`, redirect: '/' },
// Fallback to baseRoute for unprefixed, unmatched routes (try again with prefix)
{ path: `*`, redirect: to => prefix + to.path }

（一个有趣的陷阱是，在重定向函数中，如果您重定向了to值，则该值保持不变，因此我最初使用to => to.path.startsWith(prefix) ? '/' : prefix + to.path遇到了无限循环）

Vue路由器中的复杂重定向

1 个答案: