vue.js - Vue JS - 如何将路由 (:id) 转换为 i18N 翻译？

Question

想象一下这个 Vue JS 模板：

<template>
    <b-container>
      <b-row>
        <b-col>
          <div>
          {{$t("competence.*web-developer*.title1")}}
          </div>
        </b-col>
      </b-row>
  </b-container>
</template>

现在想象' web-developer '是路由ID。

路线运行良好。

const routes = [
{ path: '/competences/:id', name: Competences, component: Competences, props: true }

];

我的问题：我怎样才能让 {{this.$route.params.id}} 像这样进入我的翻译...

{{$t("competence.{{this.$route.params.id}}.title1")}}

我意识到我不能做到这一点，但这就是我想要实现的目标。处理翻译字符串中的动态值的最佳方法是什么？

谢谢！

标签： vue.jsvue-routervue-i18n

Answer 1

您可以使用名称 attr 在路由之间导航，并使用国际化值归档路径参数。这样你就可以在路径中传递任何东西。