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")}}

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

谢谢！

Answer 1

您可以使用名称attr在路线之间导航，并使用国际化值归档path参数。这样，您可以在路径中传递任何内容。

Answer 2

您可以在模板中连接字符串。

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

Vue JS-如何将路线（：id）转换为i18N？

2 个答案: