Vue下的国际化处理方法


Posted in Javascript onDecember 18, 2017

1:首先安装 Vue-i8n

npm install vue-i18n --save

注:-save-dev是指将包信息添加到devDependencies,表示你开发时依赖的包裹。 -save是指将包信息添加到dependencies,表示你发布时依赖的包裹。

2:在main.js中配置信息

import VueI18n from 'vue-i18n'
import {getCookie} from './common/cookie' //引入一个js文件,使用引入的函数getCookie,根据当前缓存切换语言
Vue.use(VueI18n)
const i18n = new VueI18n({
locale: getCookie('PLAY_LANG','cn-zh'), //根据当前语言切换

messages: {


'cn-zh': require('./language/cn-zh'), //中文语言包


'en-us': require('./language/en-us') //英文语言包

}
})
new Vue({

el: '#app',

i18n, // 不要忘记

router,

template: '<App/>',

components: { App }
})

3:在目录src下新建一个language文件,尽可能与main.js同级存放,添加两个js文件,cn-zh和en-us,存放需要翻译的语言

4:getCookie函数

function getCookie(name,defaultValue) {
var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)"); //"(^| )" 匹配开头和空格

if (arr = document.cookie.match(reg))


return unescape(arr[2]);

else


return defaultValue;
}
export {

getCookie
}

以上这篇Vue下的国际化处理方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript Tab 导航插件 (23个)
Jun 11 Javascript
javascript浏览器兼容教程之事件处理
Jun 09 Javascript
jQuery实现的超酷苹果风格图标滑出菜单效果代码
Sep 16 Javascript
基于AngularJS+HTML+Groovy实现登录功能
Feb 17 Javascript
jQuery实现验证年龄简单思路
Feb 24 Javascript
JavaScript中利用构造器函数模拟类的方法
Feb 16 Javascript
Vue2.0利用 v-model 实现组件props双向绑定的优美解决方案
Mar 13 Javascript
vuejs使用FormData实现ajax上传图片文件
Aug 08 Javascript
Angular4开发解决跨域问题详解
Aug 28 Javascript
Javacript中自定义的map.js  的方法
Nov 26 Javascript
详解vue-cli 本地开发mock数据使用方法
May 29 Javascript
js 判断当前时间是否处于某个一个时间段内
Sep 19 Javascript
webpack多页面开发实践
Dec 18 #Javascript
Vue侧滑菜单组件——DrawerLayout
Dec 18 #Javascript
switchery按钮的使用方法
Dec 18 #Javascript
three.js实现3D影院的原理的代码分析
Dec 18 #Javascript
JS函数节流和函数防抖问题分析
Dec 18 #Javascript
vue 将页面公用的头部组件化的方法
Dec 18 #Javascript
浅谈使用React.setState需要注意的三点
Dec 18 #Javascript
You might like
php遍历目录方法小结
2015/03/10 PHP
PHP中Http协议post请求参数
2015/11/02 PHP
PHP如何读取由JavaScript设置的Cookie
2017/03/22 PHP
PHP实现的redis主从数据库状态检测功能示例
2017/07/20 PHP
Laravel框架用户登陆身份验证实现方法详解
2017/09/14 PHP
phpQuery采集网页实现代码实例
2020/04/02 PHP
jquery 表单取值常用代码
2009/12/22 Javascript
PHP 与 js的通信(via ajax,json)
2010/11/16 Javascript
JavaScript学习笔记记录我的旅程
2012/05/23 Javascript
JQUERY对单选框(radio)操作的小例子
2013/04/25 Javascript
JQuery获取样式中的background-color颜色值的问题
2013/08/20 Javascript
JS 日期比较大小的简单实例
2014/01/13 Javascript
js检测网络是否具体连接功能的代码
2014/05/23 Javascript
node.js中的fs.rename方法使用说明
2014/12/16 Javascript
jquery ajaxfileupload异步上传插件使用详解
2017/02/08 Javascript
vue2.0结合Element实现select动态控制input禁用实例
2017/05/12 Javascript
Vue写一个简单的倒计时按钮功能
2018/04/20 Javascript
vuex与组件联合使用的方法
2018/05/10 Javascript
jQuery+ajax实现批量删除功能完整示例
2019/06/06 jQuery
Javascript Symbol原理及使用方法解析
2020/10/22 Javascript
[47:48]DOTA2上海特级锦标赛D组小组赛#2 Liquid VS VP第三局
2016/02/28 DOTA
[02:37]2018DOTA2亚洲邀请赛赛前采访 VP.no[o]ne心中最强SOLO是谁
2018/04/04 DOTA
详解如何将python3.6软件的py文件打包成exe程序
2018/10/09 Python
python实现接口并发测试脚本
2019/06/25 Python
python实现的发邮件功能示例
2019/09/11 Python
Flask框架搭建虚拟环境的步骤分析
2019/12/21 Python
python openpyxl模块的使用详解
2021/02/25 Python
Android本地应用打开方法——通过html5写连接
2016/03/11 HTML / CSS
HTML5 新旧语法标记对我们有什么好处
2012/12/13 HTML / CSS
Lowe’s加拿大:家居装修、翻新和五金店
2019/12/06 全球购物
澳大利亚手袋、珠宝和在线时尚精品店:The Way
2019/12/21 全球购物
请写出 float x 与"零值"比较的 if 语句
2016/01/04 面试题
出国考察邀请函
2014/01/21 职场文书
学员自我鉴定
2014/03/19 职场文书
2014年助理政工师工作总结
2014/12/19 职场文书
会计工作能力自我评价
2015/03/05 职场文书