Vue前端项目国际化
一、通过配置实现中英文
-
在
vela/language/index.js
文件中,引入Vue I18n库,并定义中英文语言资源文件 -
在locale-cn.js和locale-en.js中分别定义对应的中英文字典
-
修改vue页面需要翻译的内容:格式为:$t(‘字段路径’)
-
至此,即可实现通过配置vela/language/index.js中的locale的值(cn中文/en英文),实现系统的中英文切换。
二、增加按钮,控制中英文切换
-
进入系统时,需要先默认一个语种,这里以english为例
-
在系统登录页面,定义一个全局变量language
-
-
进入系统,根据全局变量,自动获取当前语种
-
基于上面的操作,在页面中对应的位置增加按钮,将按钮赋值为步骤2获取的languageFlag