摘要: 之前做导出表格功能时,都是后端进行实现,最近,领导要求前端实现导出,经过一番查找资料终于实现。 普通方式 下包 npm i -S file-saver xlsx 在util文件夹新建类 建立to_xlsx.js 1 import FileSaver from 'file-saver'; 2 impo 阅读全文
posted @ 2022-05-17 10:41 yuwenjing 阅读(31) 评论(0) 推荐(0) 编辑
摘要: 最近做项目中,🈶️遇到过实现模版打印功能,网上也找到很多资料可以实现,有的方式可以实现分页,但是打印的A4纸上下不能留边距,后来找到一个通过剪裁的方式可以实现左右上下留边距,并且能实现分页; 方法如下:基本思路是对获得的canvas进行切割,按A4纸大小并留边距后的比例进行剪裁,切出一页一页的内容 阅读全文
posted @ 2022-01-14 15:15 yuwenjing 阅读(340) 评论(0) 推荐(0) 编辑
摘要: 在使用element-ui的过程中,我相信你在使用到类似this.$message功能的时候,会觉得这个功能真的非常方便,不用import入组件,全局都可以调用。它就是通过Vue.extend + $mount实现。 扩展实例构造器 Vue.extend返回的是一个“扩展实例构造器”,也就是一个预设 阅读全文
posted @ 2021-08-19 15:41 yuwenjing 阅读(509) 评论(0) 推荐(2) 编辑
摘要: 函数防抖(debounce):当持续触发事件时,一定时间段内没有再触发事件,事件处理函数才会执行一次,如果设定的时间到来之前,又一次触发了事件,就重新开始延时。 函数节流(throttle):当持续触发事件时,保证一定时间段内只调用一次事件处理函数。 1 /** 2 * @desc 函数防抖 3 * 阅读全文
posted @ 2021-06-30 10:33 yuwenjing 阅读(371) 评论(0) 推荐(1) 编辑
摘要: 近期做项目时需要做一个横向的树结构的图,如下所示: 本图的实现采用了leader-line-vue组件, 具体实现如下: 先npm install leader-line-vue --save,安装依赖 然后,子组件RightTree的封装,代码如下: 1 <template> 2 <div cla 阅读全文
posted @ 2021-06-23 10:42 yuwenjing 阅读(1224) 评论(0) 推荐(2) 编辑
摘要: /** * @description: 通过表格索引 定位表格的位置 * @param {refName} table的ref值 * @param {index} table的索引值 * @return: * @author: ywj */ $tableScrollMove(refName,inde 阅读全文
posted @ 2021-05-07 17:20 yuwenjing 阅读(1525) 评论(0) 推荐(4) 编辑
摘要: 最新在做一个页面,涉及到文件上传及文件回显,界面如下: 直接上文件代码,这里算是较为全面的文件上传了 1 <template> 2 <div class="information-wrapper"> 3 <div class="content"> 4 <el-form 5 ref="informat 阅读全文
posted @ 2020-12-01 14:43 yuwenjing 阅读(724) 评论(0) 推荐(1) 编辑
摘要: 最新做项目时,遇到了让固定定位的实现,现整理为一个小demo <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initi 阅读全文
posted @ 2020-11-26 10:24 yuwenjing 阅读(379) 评论(0) 推荐(1) 编辑
摘要: 看了很多的关于闭包的文章,你不是还是一头雾水,还是不理解闭包的意义。 最近我看了一篇文章,关于闭包的讲解,可以说是讲得非常通俗易懂,于是记录下来,以便加深理解。 1、概念 闭包函数:声明在一个函数中的函数,叫做闭包函数。 闭包:内部函数总是可以访问其所在的外部函数中声明的参数和变量,即使在其外部函数 阅读全文
posted @ 2020-11-09 16:41 yuwenjing 阅读(446) 评论(0) 推荐(2) 编辑
摘要: 效果图: 完整代码: 1 <template> 2 <div> 3 <div class="content-view"> 4 <div v-for="(item, index) in progressList" class="item-view"> 5 <el-progress :text-insi 阅读全文
posted @ 2020-11-07 10:34 yuwenjing 阅读(6131) 评论(2) 推荐(0) 编辑