八:Vue下的国际化处理
p { margin-bottom: 0.25cm; line-height: 120% }
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下的国际化处理的更多相关文章
- 八:前端---Vue下的国际化处理
1:首先安装 Vue-i8n npm install vue-i18n --save 注:-save-dev是指将包信息添加到devDependencies,表示你开发时依赖的包裹. -save是指将 ...
- 初识ABP vNext(6):vue+ABP实现国际化
Tips:本篇已加入系列文章阅读目录,可点击查看更多相关文章. 目录 前言 开始 语言选项 语言切换 注意 最后 前言 上一篇介绍了ABP扩展实体,并且在前端部分新增了身份认证管理和租户管理的菜单,在 ...
- 基于Typescript的Vue项目配置国际化
基于Typescript的Vue项目配置国际化 简介 使用vue-i18n插件对基于Typescript的vue项目配置国际化,切换多种语言, 配合element-ui或者其他UI库 本文以配置中英文 ...
- vue 下实现 echarts 全国到省份的地图下钻
vue 下实现 echarts 全国到省份的地图下钻 项目地址:https://github.com/cag2050/vue_echarts_v3_demo
- Web标准:八、下拉及多级弹出菜单
Web标准:八.下拉及多级弹出菜单 知识点: 1.带下拉子菜单的导航菜单 2.绝对定位和浮动的区别和运用 3.CSS自适应宽度滑动门菜单 1)带下拉子菜单的导航菜单 带下拉子菜单的就是在一级导航下 ...
- checked、disabled在原生、jquery、vue下不同写法
以下是原生和jquery <!DOCTYPE html> <html> <head> <meta http-equiv="Content ...
- 浅谈Vue下的components模板
浅谈Vue下的components模板在我们越来越深入Vue时,我们会发现我们对HTML代码的工程量会越来越少,今天我们来谈谈Vue下的 components模板的 初步使用方法与 应用 我们先来简单 ...
- VUE(下)
VUE(下) VUE指令 表单指令 数据的双向指令 v-model = "变量" model绑定的变量,控制的是表单元素的value值 普通表单元素用v-model直接绑定控制va ...
- vue下实现input实现图片上传,压缩,拼接以及旋转
背景 作为一名前端工作人员,相信大家在开发系统的时候,经常有遇到需要这么一种需求,就是需要为用户保存上传的图片,很多小白遇到这个问题的时候,都会虎躯一震,以为会是一个棘手的问题,当你读完这篇文章的时候 ...
随机推荐
- Spring事务管理—aop:pointcut expression解析(转)
本文转载自: http://hane00.blog.163.com/blog/static/160061522011427473965/ 先来看看这个spring的配置文件的配置: <!-- 事 ...
- Java虚拟机之Java内存区域
Java虚拟机运行时数据区域 ⑴背景:对于c/c++来说程序员来说,需要经常去关心内存运行情况,但对于Java程序员,只需要在必要时关心内存运行情况,这是因为在Java虚拟机自动内存管理机制的帮助下, ...
- c字符数组
一.PTA实验作业 题目1:统计一行文本的单词个数 1. 本题PTA提交列表 2. 设计思路 定义一个长度为1000的字符数组str[1000] 在定义 i=0,cnt=0:cnt用来记录单词的个数 ...
- 201621123057 《Java程序设计》第4周学习总结
1. 本周学习总结 1.1 写出你认为本周学习中比较重要的知识点关键词 答: (普通方法 / 构造函数)重载. static . final.继承与多态.extends.object类.abstrac ...
- 本地通知UILocalNotification
1.增加一个本地推送 //设置20秒之后 ]; //chuagjian一个本地推送 UILocalNotification *noti = [[[UILocalNotification alloc] ...
- 如何使用ILAsm与ILDasm修改.Net exe(dll)文件
一.背景 最近项目组新上项目,交付的时间比较急迫,原本好的分支管理习惯没有遵守好,于是出现下面状况: 多个小伙伴在不同的分支上开发. 原本QA环境也存在一个阻碍性的bug A 一位同事在QA环境发布了 ...
- Unix下zfs文件系统重组RAID-5后可以这样恢复
存储做的RAID-5, SCSI硬盘,操作系统是FreeBSD,文件系统是zfs.本案例共有12块硬盘,11块硬盘里有数据,1块硬盘是热备盘.其中第6块数据硬盘出现故障,重组时需要将其剔除. 物理盘: ...
- 使用JDBC中的出现的乱码和查询无结果问题
使用JDBC中的问题 连接的后出现查询结果是乱码. 1.可能是代码的编码与数据库的编码不同 有可以将二者都设置为UTF-8 2.如果比较懒得话可以只设代码为UTF-8 mysql 连接url中us ...
- svn的使用技巧
就是如果想一个文件在提交的时候不被上传,可以设置忽略这样提交的时候就不会被上传
- 增加Linux虚拟机的硬盘空间
原配置为40G,现需要增加到60G,操作方法如下: 一.虚拟机关机,在编辑设置里调整硬盘空间到60G 二.虚拟机开机,扩展硬盘空间 1.安装gparted,命令如下 sudo apt-get inst ...