Lzh on GitHub

按组件翻译

在您的组件中内联您的翻译消息。

如果你想按页面或按组件定义翻译，你可以利用 i18n 自定义块。

你现在可以在你的 Vue 文件中使用 i18n 自定义块定义翻译：

page.vue
<script setup lang="ts">
const { t } = useI18n({
  useScope: 'local'
})
</script>

<template>
  <p>{{ t('hello') }}</p>
</template>

<i18n lang="json">
{
  "en": {
    "hello": "hello world!"
  },
  "ja": {
    "hello": "こんにちは、世界!"
  }
}
</i18n>

或者使用 Yaml 语法：

page.vue
<i18n lang="yaml">
en:
  hello: 'hello world!'
ja:
  hello: 'こんにちは、世界!'
</i18n>
阅读更多关于 i18n 自定义块 的内容
当您使用按组件翻译时，您需要使用由 useI18n() 导出的 t()，而不是 $t()。 要了解更多关于不用于按组件翻译的 $t() 的信息，请参阅 Vue I18n 文档的“带有注入属性和函数的隐式”部分。