Question

我们正在引入Vue.js来管理前端。与此同时，我们正在考虑采用另一种方式在整个应用程序堆栈中管理I18n。

最初的计划解决方案是使用gettext实现，例如fast_gettext。但是由于Vue.js的到来，一个额外的约束是能够为传统的Rails视图和Vue.js渲染元素使用相同的locale存储库。

一种可能的有效解决方案是使用类似于erb文件的方式执行rails代码。

有关信息，Vue.js是通过webpacker安装的，因为我们发现的宝石似乎已经过时了。

Answer 1

您可以使用i18n-js。
https://github.com/fnando/i18n-js

它允许您使用config/locale yaml文件，就好像它们是vue代码的一部分一样。按照项目页面上的安装说明进行操作后，您可以创建如下所示的mixin：

export default {
  methods: {
    t: (...args) => I18n.t(...args),
    currentLocale: () => I18n.currentLocale()
  }
}

这样导入：

<template></template>

<script>
import i18n from "../mixins/i18n"

export default {
  mixins: [i18n]
}
</script>

并像这样使用：

<button @click="toggleItem(content)">
  <span v-if="isSelected">
    {{ t("remove") }}
  </span>
  <span v-else>
    {{ t("add") }}
  </span>
</button>

在Rails + Vue.js实例上是否存在I18n，它在单个存储库中共享语言环境？

1 个答案: