vue里的$t

在Vue中，有一个非常重要的概念，那就是$t。$t是Vue提供的一个国际化插件，它的作用是帮助我们在不同的语言环境下展示不同的文本。

import VueI18n from 'vue-i18n'
const i18n = new VueI18n({
  locale: 'en',// 语言
  messages: {
    en: {
      hello: 'hello world'
    },zh: {
      hello: '你好，世界'
    }
  }
})

在上面的代码中，我们通过VueI18n将不同语言下的文本进行了配置。locale表示当前使用的语言，messages中可以写入多种语言环境下的文本。我们可以通过$t方法来访问这些文本，它的用法如下：

{{$t('hello')}}

上面的代码将会显示当前语言环境下的hello文本。我们可以通过修改locale来切换不同语言环境下的文本，如下：

i18n.locale = 'zh'

上面的代码修改了当前语言环境为中文，这时候hello文本将会显示为“你好，世界”。

$t方法还支持传递参数，以便我们动态替换文本内容，如下：

import VueI18n from 'vue-i18n'
const i18n = new VueI18n({
  locale: 'en',messages: {
    en: {
      hello: 'hello {name}'
    },zh: {
      hello: '你好，{name}'
    }
  }
})

{{$t('hello',{name: 'Vue'})}}

上面的代码将会输出hello Vue，我们可以动态的替换文本中的{name}部分。

除了使用$t方法，Vue I18n还提供了很多其他方法，如$t、$te、$d、$n、$s等等。其中，$d可以帮助我们格式化时间，$n可以格式化数字，$s可以格式化字符串。

总之，在Vue项目中，国际化已经不再是什么稀奇的东西，我们可以通过Vue I18n插件方便地实现国际化，让我们的网站更具用户友好性。