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 相关文章推荐
某页码显示的helper 少量调整,另附js版
Sep 12 Javascript
input按钮的事件处理大全
Dec 10 Javascript
JS 页面计时器示例代码
Oct 28 Javascript
用Jquery.load载入页面后样式没了页面混乱的解决方法
Oct 20 Javascript
浅谈javascript的调试
Jan 28 Javascript
JavaScript自定义分页样式
Jan 17 Javascript
Vue中定义全局变量与常量的各种方式详解
Aug 23 Javascript
详解基于 axios 的 Vue 项目 http 请求优化
Sep 04 Javascript
浅析vue插槽和作用域插槽的理解
Apr 22 Javascript
Jquery让form表单异步提交代码实现
Nov 14 jQuery
基于element-ui封装可搜索的懒加载tree组件的实现
May 22 Javascript
vue 实现tab切换保持数据状态
Jul 21 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-fpm超时时间设置request_terminate_timeout资源问题分析
2019/09/27 PHP
ExtJS GridPanel 根据条件改变字体颜色
2010/03/08 Javascript
前端开发必须知道的JS之原型和继承
2010/07/06 Javascript
javascript天然的迭代器
2010/10/29 Javascript
dtree 网页树状菜单及传递对象集合到js内,动态生成节点
2012/04/14 Javascript
jquery 插件学习(六)
2012/08/06 Javascript
使用javascript实现判断当前浏览器
2015/04/14 Javascript
nodejs模块nodemailer基本使用-邮件发送示例(支持附件)
2017/03/28 NodeJs
JS仿QQ好友列表展开、收缩功能(第二篇)
2017/07/07 Javascript
jQuery实现的回车触发按钮事件功能示例
2018/03/25 jQuery
vue中,在本地缓存中读写数据的方法
2018/09/21 Javascript
详解vuex中action何时完成以及如何正确调用dispatch的思考
2019/01/21 Javascript
微信小程序数据统计和错误统计的实现方法
2019/06/26 Javascript
vue 路由守卫(导航守卫)及其具体使用
2020/02/25 Javascript
Python open读写文件实现脚本
2008/09/06 Python
python中numpy基础学习及进行数组和矢量计算
2017/02/12 Python
深入理解Python爬虫代理池服务
2018/02/28 Python
DataFrame:通过SparkSql将scala类转为DataFrame的方法
2019/01/29 Python
Python求均值,方差,标准差的实例
2019/06/29 Python
在django中自定义字段Field详解
2019/12/03 Python
Python OpenCV去除字母后面的杂线操作
2020/07/05 Python
Python基于argparse与ConfigParser库进行入参解析与ini parser
2021/02/02 Python
HTML5播放实现rtmp流直播
2020/06/16 HTML / CSS
日本高端护肤品牌:Tatcha
2016/08/29 全球购物
中国包裹转运寄送国际服务:Famiboat
2019/07/24 全球购物
戴尔新西兰官网:Dell New Zealand
2020/01/07 全球购物
体育教师自荐信范文
2013/12/16 职场文书
人事部专员岗位职责
2014/03/04 职场文书
五一手机促销方案
2014/03/08 职场文书
2014迎国庆标语大全
2014/09/19 职场文书
政风行风整改方案
2014/10/25 职场文书
幼儿园大班毕业评语
2014/12/31 职场文书
2015年物资管理工作总结
2015/05/20 职场文书
MongoDB 常用的crud操作语句
2021/06/20 MongoDB
联想win10摄像头打不开怎么办?win10笔记本摄像头打不开解决办法
2022/04/08 数码科技
MySQL中TIMESTAMP类型返回日期时间数据中带有T的解决
2022/12/24 MySQL