Nuxt/Vue-Router 导航守卫重新路由到动态路由答案

【问题标题】：Nuxt/Vue-Router Navigation Guards Reroute to Dynamic RouteNuxt/Vue-Router 导航守卫重新路由到动态路由
【发布时间】：2019-10-21 04:02:38
【问题描述】：

我目前使用 nuxt 2.7.1 开发一个 SPA Web 应用程序，作为我学士论文的一部分。

在我的一些页面上，我设置了beforeRouteEnter 导航守卫来检查用户是否可以访问该页面。如果没有，我想将用户重定向到动态路由（即/info/1）。

当访问受导航保护保护的页面时，Nuxt 会显示一个错误页面，指出 This page could not be found，尽管 URL 是正确的，并且在错误页面上简单的重新加载正确地将我引导到动态路由。

我目前正在通过以下方式使用导航守卫：

beforeRouteEnter(to, from, next) {
  if (!isValidAccess()) {
    console.warn("illegal access");
    next(`/info/1`);
  } else next();
}

为了澄清，我的目录结构如下：

pages
  |__ info
  |    |__ _index.vue (redirect target)
  |__ shop
       |__ _index.vue (with navigation guard)

我尝试过传递给next() 的参数，但到目前为止没有成功。在目标路由中实现另一个beforeRouteEnter 并记录to 参数时，一切似乎都很正常。

我希望你们能帮助我。我已经在这个问题上花费了太多时间。

最好的问候

编辑：

我创建了一个最小的示例，其中路由到动态路由没有问题...https://codesandbox.io/embed/codesandboxnuxt-t1d0e

当我找到问题的解决方案时，我会更新问题。

【问题讨论】：

【解决方案1】：

这对我有用 - 在登录页面（索引）上，您会被重定向到您的 /info/1 动态路由。这是你想要的吗？

我所做的唯一一件事就是将您的动态路由包装在 <no-ssr> 标记中以消除错误。您的组件与 SSR 不兼容。

【讨论】：