Question

我这边有一个小路由器，基本上我想为我的网站提供一个默认语言。这意味着，如果您访问www.example.com/about和www.example.com/es/about

，则应该看到相同的内容

我认为别名会对此有所帮助，但是在尝试访问/关于我时会遇到错误。

[vue-router] missing param for aliased route with path "/:language/about": Expected "language" to be defined

这是有道理的，因为：语言参数没有设置，有什么办法可以实现我想要的吗？每当用户点击别名时，我可以设置fixed：语言参数吗？

这是我的路由器。

router = new Router({
  routes: [
    {
      path: '/:language/about',
      alias: '/about'
      component: About
    }
  ]
})

Answer 1

使用可选参数（附加？）将解决此问题。您甚至不需要别名：

router = new Router({
  routes: [
    {
      path: '/:language?/about',
      component: About
    }
  ]
})

Answer 2

如果url：

中没有提供任何语言，则路由配置会将任意语言设置为默认语言

var routes = [
{
    path: '/:lang',
    component: WelcomeComponent,
    children: [
    {
        path: 'hello/:name',
        component: HelloComponent
    }
    ]
},
path: '*',
redirect: '/en'
]

如果用户直接访问/：lang

，则在每条路线后设置来自网址的lang

router.afterEach((to, from) => {
    Vue.config.lang = to.params.lang
}

我是从我经常参考的论坛帖子中提取的。它还包括语言切换器组件的一些逻辑：https://forum.vuejs.org/t/dynamic-base-in-vue-router/1026/4

具有固定参数的Vue-router别名

2 个答案: