$te 方法如果包含空格则找不到现有密钥

Question

我已经在 vue-i18n 官方页面上提出了一个 [issue][1]，但是解决这个问题真的会帮助我解决这就是我在这里问的原因。

我直接使用翻译键作为英文翻译，所以一些翻译键看起来像这样'Next':'Weiter'，而其他的则包含空格甚至完整的句子：'This text is translated.':'Dieser Text ist übersetzt.'。

因此，为了防止出现关于缺少英文翻译的一百万条警告，我想首先检查密钥 (this.$te('key'))，但是当密钥包含空格时，这似乎不起作用。即使翻译键存在并且翻译正在工作，它也会返回 false。

有人知道这个问题的解决方案还是我必须等到有人在 github 页面上解决我的问题/在包本身上修复它？

编辑：该问题已在最新版本的 vue-i18n 中修复。我的另一个问题仍然存在。缺少的处理程序选项不会阻止引发警告，因此这也不起作用。 我通过在 vue 实例上添加自己的翻译方法来解决它：

Vue.prototype.$trans = function (key) {
    return i18n.te(key) ? i18n.t(key) : key;
}

这样它只会在它确实存在的情况下翻译密钥，但如果我想使用复数等，它仍然会变得复杂，所以它不是一个长期的解决方案。 [1]：https://github.com/kazupon/vue-i18n/issues/1309

Answer 1

您描述的问题确实存在于版本 7.3.2 中，但该版本几乎是 4 years old 并且当前版本 8.24.5 可以正常工作 - 请参见下面的示例

在我看来，避免不必要的错误消息的更好方法是提供自定义missing handler

var messages = {
  en: {},
  de: {
    'Test translation': 'Test Übersetzung'
  }
}

Vue.use(VueI18n)

var i18n = new VueI18n({
  locale: 'de',
  messages: messages
})
new Vue({
  i18n: i18n
}).$mount('#app')

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.js"></script>
<script src="https://unpkg.com/vue-i18n@8"></script>
<!-- <script src="https://unpkg.com/vue-i18n@7.3.2/dist/vue-i18n.js"></script> -->
<div id="app">
  <p>de (implicit): {{ $te("Test translation") }}</p>
  <p>de: {{ $te("Test translation", 'de') }}</p>
  <p>en: {{ $te("Test translation", 'en') }}</p>
</div>