这是我参与「第五届青训营 」伴学笔记创作活动的第 32 天

Vue I18n是vue（2和3都支持）的一个插件，可以用它来管理语言环境，目前已经有了v9版本。

注入

i18n具有多种注入方式，比如常用的$t，可以结合下面的例子理解。
它可以接受三个参数：message-path、locale、array或者object。
第一个参数是必选的，它是要选择的信息；第二个参数用来指定要选择的语言环境是可选的；第三个参数是数组或者对象可以用它来实现格式化，也是可选的。

格式化

const messages = {
    en: {
        message: {
            hello: 'world'
        }
    }
    cn：{
        //...
    }
}

在这个例子中，创建了一个英语的环境，它具有一个message对象属性，这个对象的属性值我们可以对其进行格式化。 现在还没对其进行格式化，可以这样使用它。

<p>{{ $t(message.hello) }}</p>

这会输出world。

具名格式化{}

const messages = {
    en: {
        message: {
            hello: '{msg} world'
        }
    }
}

msg就是这个名，我们可以在注入的时候用对象（上面提到的可选的、第三个参数）给他传入值。

<p>{{ $t(message.hello,  { msg : 'hello'})}}</p>

列表格式化[]

这里的列表并不是值html的列表，而是一个格式方式，感觉这个起名有点误导人。

const messages = {
    en: {
        message: {
            hello: '{0} world'
        }
    }
}

在给它格式化的时候既可以用对象也可以用数组。

<p>{{ $t(message.hello,  ['hello'])}}</p>

感觉这种方式有点像数组，对象参照上文。

HTML格式化

你甚至可以在message输出的信息增加html的标签来让它用html的格式输出。

当然这种操作是不能用{{}}文本插值的，而是要用v-model指令，这和在vue中是一样的，所以好像不需要大惊小怪。

其它

官网中有提到还支持ruby的特定格式，但是ruby应该很少用到了吧在现在。

自定义格式化就需要ES2015的class了，不过只是简单的语言管理的话应该用不到。

复数

字面意思，一个属性可以有多个值并用 | 分割。 这就要使用$tc这个注入了，相比$t，它增加了一个参数用来选择要输出的信息，注意下标是从1开始的，默认值也是1。

因为项目要求只用到了这些就写到这里了。