type
status
date
slug
summary
tags
category
icon
password
前言：国际化(i18n)指在不修改内部代码的情况下，能根据不同语言及地区显示相应的界面。针对于目前所接触到的售卖端和管理端项目，进行国际化方案总结。
方案一.手动配置
1.语言配置文件管理：手动维护不同语言的json文件
2.语言选择/切换机制
优先级：url > Cookie > 浏览器自选 > EN
2.1 浏览器语言自动选择的机制
获取浏览器语言
匹配支持语言
设置语言
保存语言偏好：
应用语言设置：
2.2 系统确定使用哪种语言的流程
通过header中的语言选择栏默认选择语言，并提供语言切换功能
语言选择的优先级：
3.翻译文本调用：
4.总结流程
方案二.vue-i18n
- Git地址：github.com/kazupon/vue…
该插件的解决方案也是基于多个国家配置不同的语言文案,通过对应key动态渲染。
1. 安装
2. 定义语言文件
3. 引入依赖并注册语言包
4. 模板中使用
三. 优缺点对比
使用场景对比：
实现方式对比：
性能对比：
维护性对比
总结归纳
传统方案
Vue I18n：
电商网站建议使用 JSON 配置方案:
- SEO 重要
- 首屏性能关键
- 静态内容为主
后台管理系统建议使用 Vue I18n:
- 不需要 SEO
- 交互复杂