vue默认重定向导致最大堆栈错误

Question

所以我的vue-router的这一部分引起了问题：

{
    component: Tutorial,
    name: "tutorial",
    path: "/tutorial/:page?",
    redirect: "/tutorial/0",
},

如果我删除了重定向，问题就消失了。此路线路径也没有孩子。无法分配默认参数值吗？

Answer 1

如果您在redirect部分中设置了默认值。它将转到/tutorial/0，然后它将一次又一次重定向到/tutorial/0 ...

如果要设置默认参数值。您可以在Tutorial组件中实现它。

例如：

// In Tutorial component
beforeRouteEnter() {
    this.$route.params.page = this.$route.params.page ? this.$route.params.page : 0
}

Answer 2

因为"/tutorial/0"也匹配"/tutorial/:page?"。

由于路由器配置是先进先出，

您可以像这样定义路线

    {
      component: Tutorial,
      name: 'tutorial',
      path: '/tutorial/0'
    },
    {
      path: '/tutorial/:page?',
      redirect: '/tutorial/0'
    }

如果当前路径与/tutorial/0相匹配，它将呈现您的组件。如果不匹配/tutorial/0，Vue将检查是否匹配/tutorial/:page?并进行重定向（如果匹配）。