Nuxt/Vue js - 如何将路径字段同步到路由器中的 i18n 变量。我试过了，但无法进入 i18n

Question

import Vue from 'vue'
import Router from 'vue-router'

import homePage from '~/pages/index'

Vue.use(Router)

export function createRouter() {
  return new Router({
    mode: 'history',
    routes: [
      {
        path: this.$i18n.t('home'), // don't work
        component: homePage
      }
    ]
  })
}

如何像示例中那样使用它？因为我想根据语言的变化来改变路径。

Answer 1

正如您也要求 Nuxt，有一个模块可以做到这一点：nuxt-i18n
以下是您要查找的内容的相关文档：routing custom paths

在您的 nuxt.config.js 文件中看起来像这样：

export default {
  modules: [
    ...,
    [
      'nuxt-i18n', {
        parsePages: false,
        pages: {
          about: {
            en: '/about',
            fr: '/a-propos',
          },
          'services/index': {
            en: '/services',
            fr: '/offres',
          },
        }
      }
    ],
    ...
  ]
}

没试过，但也可以在 full static 渲染中完成。