VUE3 国际化

307 阅读1分钟

1、什么是 i18n 国际化

国际化(Internationalization)指的是同一个网站可以支持多种不同的语言,以方便不同国家,不同语种的用户访问。因此在很多大型的项目中肯定是需要做国际化支持多种语言的,因英文名 Internationalization 单词太复杂,所以取第一个字母(I)和最后一个字母(n),中间还有18个英文字母,故而取名为 I18n。

2、安装 vue-i18n

npm install vue-i18n@next

3、配置

第一步 创建本地语言包

在src目录下创建 i18n 文件夹

i18n 文件夹下创建config文件夹存放语言包,例如 中文包zh.js

index.js

第二步 全局引入注册

main.js

第三步 项目中使用

1)标签中使用

2)js中使用

3)切换语言

切换语言

demo 示例

以上是本人使用得过程,如有其他小伙伴有更好得建议欢迎评论区留言一起交流~