基于vue项目的js工具方法汇总
2019-05-18 07:07:53来源:博客园 阅读 ()
以下是个人过去一年在vue项目的开发过程中经常会用到的一些公共方法,在此进行汇总,方便以后及有需要的朋友查看~
let util = {};
/** * @description 日期格式化 * @param {Date} date 日期 * @param {String} fmt 日期格式 eg: yyyy-MM-dd hh:mm:ss */ util.dateFormat = function (date, fmt) { var o = { 'M+': date.getMonth() + 1, // 月份 'd+': date.getDate(), // 日 'h+': date.getHours(), // 小时 'm+': date.getMinutes(), // 分 's+': date.getSeconds(), // 秒 'q+': Math.floor((date.getMonth() + 3) / 3), // 季度 'S': date.getMilliseconds() // 毫秒 }; if (/(y+)/.test(fmt)) { fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length)); } for (var k in o) { if (new RegExp('(' + k + ')').test(fmt)) { fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length))); } } return fmt; };
/** * @description 文件下载 * @param {Object} data 数据 * @param {String} fileName 下载文件名 */ util.download = function (data, fileName) { //创建一个blob对象,file的一种 let blob = new Blob([data], { type: 'application/x-xls' }); if ('download' in document.createElement('a')) { // 非IE下载 let link = document.createElement('a'); if (window.URL) { link.href = window.URL.createObjectURL(blob); } else { link.href = window.webkitURL.createObjectURL(blob); } link.download = fileName; document.body.appendChild(link); link.click(); link.remove(); }else { // IE10+下载 navigator.msSaveBlob(blob, fileName); } };
/** * @description 校验导入execl格式 * @param {file} file 导入文件对象 */ util.validateExecl = function(file) { const isXLS = file.type === 'application/vnd.ms-excel'; const isXLSX = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'; if (!isXLS && !isXLSX) { this.$message.error('只支持导入execl文件'); return false; } };
/** * @description 校验上传图片格式和大小 * @param {file} file 导入文件对象 */ util.validateImage = function(file) { const isPNG = file.type.toLowerCase() === 'image/png'; const isJPG = file.type.toLowerCase() === 'image/jpeg'; const isLt2M = file.size / 1024 / 1024 < 2; if (!isJPG && !isPNG) { this.$message.error('上传图片只能是JPG或PNG格式!'); return false; } if (!isLt2M) { this.$message.error('上传图片大小不能超过 2M!'); return false; } };
AES加密/解密,需要先安装依赖 crypto-js。注:具体的选项参数可自行百度了解噢
// 自定义密钥 const key = CryptoJS.enc.Utf8.parse('ljycykxbchsbqtcy') // 加密 util.encrypt = function(str) { let srcs = CryptoJS.enc.Utf8.parse(str) let encrypted = CryptoJS.AES.encrypt(srcs, key, {mode:CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7}) return encrypted.toString() }; // 解密 util.decrypt = function(str) { let decrypt = CryptoJS.AES.decrypt(str, key, {mode:CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7}) return CryptoJS.enc.Utf8.stringify(decrypt).toString() };
MD5加密,需要先安装依赖 js-md5
// 在main.js中添加以下代码 import md5 from 'js-md5'; Vue.prototype.$md5 = md5; // str为需要加密字段 let md5Str = this.$md5(str);
export default util;
持续更新中~~
原文链接:https://www.cnblogs.com/fengyuexuan/p/10881955.html
如有疑问请与原作者联系
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
上一篇:js常用正则表达式
下一篇:JavaScript 语句
- 基于JQuery的多标签实现代码 2020-03-29
- vue.js开发环境搭建教程 2020-03-16
- Vue input控件通过value绑定动态属性及修饰符的方法 2020-03-05
- 详解Webstorm 新建.vue文件支持高亮vue语法和es6语法 2020-02-07
- vue路由跳转时判断用户是否登录功能的实现 2020-01-17
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash