前端
文章平均质量分 62
LucianaMq
这个作者很懒,什么都没留下…
展开
-
angular——导出pdf之滚动后导出不完全
项目场景:将当前html页面导出成pdf问题描述:当滚动条置顶时,导出的pdf没任何问题,但当滚动条出现偏移后,导出的pdf要么内容缺失,要么纯空白页原因分析:导出pdf的思路:步骤一,先将页面进行分割步骤二,然后通过html2canvas将分割后的页面分别绘制成图片步骤三,最后通过jsPdf生成pdf根据导出思路可判断是在步骤二中出现了差错,查阅html2canvas的api发现配置参数有scrollY和scrollX,滚动导致页面出现了偏移,在没设置scrollY时,scrol原创 2021-07-21 10:32:02 · 522 阅读 · 0 评论 -
angular——打印之坑(nz-modal里打印,出现打印不完全的问题)
项目场景:对话框中点击打印,打印数据不全以下是相同数据,产生的打印情景异常页面:正常页面:问题描述:打印数据量超过一页,点击打印后数据仅有一页,且页面最后混乱,其余数据已获取但不显示原因分析:在显示对话框时,html会增加个classcdk-global-scrollblock ,打印替换时,该class还会存在,导致页面不能被全打印出来,其中主要是position: fixed; 影响了整个页面布局.cdk-global-scrollblock { position:原创 2021-07-21 10:11:22 · 690 阅读 · 0 评论 -
多次请求同一接口渲染的不是最新的数据
项目场景(angular):根据用户输入的内容对表格数据进行搜索显示问题描述:用户输入姓名对人员信息名单进行搜索,每输入一个字符,均会向后端进行请求,从数据库中获取符合条件的数据,当用户通过页面操作频繁请求该接口,而接口的不同参数响应时间差异较大时,易产生数据渲染混乱的问题。说明:有一个姓名搜索框,用户可输入进行人员列表搜索,当用户快速的输入张三,前端会先调一个参数是“张”的列表接口,然后再掉一次参数是“张三”的相同列表接口,第一次调用响应时间是3秒,第二次调用响应时间是1秒,因此会先返回第二次调原创 2021-07-06 15:55:24 · 1118 阅读 · 0 评论 -
angular+ng-zorro表格拖拽
angular集成了cdk drag-drop 来实现拖拽功能app.modules.ts导入import { DragDropModule } from '@angular/cdk/drag-drop';imports: [ DragDropModule]一、表格内拖拽排序<nz-table [nzData]="sourceData" [nzFrontPagination]...原创 2020-01-23 11:58:40 · 3299 阅读 · 2 评论 -
angular ng-zorro中nz-table-table表格添加滚动条,表格错位
问题:表格固定表头,增加滚动条,导致表格内列头和内容错位解决办法指定th的nzWidth属性<nz-table [nzData]="targetData" [nzFrontPagination]="false" [nzShowPagination]="false" ...原创 2020-01-23 10:57:55 · 4628 阅读 · 2 评论 -
ng-zorro在前端分页的同时,表格添加、删除、编辑行
ng-zorro在前端分页的同时,表格添加、删除、编辑行添加行删除行注意点nzData 中的数据进行增删formGroupNameelement在前端分页的同时,表格添加、删除、编辑行与element相比,ng-zorro的表格组件的前端分页是封装好的,可直接使用,nz-table中的[nzFrontPagination]属性用于判断是否前端分页,默认值为true;添加行add() { ...原创 2019-12-11 12:07:02 · 1417 阅读 · 0 评论 -
element在前端分页的同时,表格添加、删除、编辑行
element在前端分页的同时,表格添加、删除、编辑行添加行删除行编辑行具体代码如下:表格非编辑状态时仅可删除编辑表格时可编辑表格数据和添加、删除行首先要处理当前页数据,每进行一次添加删除操作,都需进行当前页的判断与处理,通过fliter过滤符合条件的数据handleCurrentChange (val) { console.log(`当前页: ${val}`); ...原创 2019-12-11 11:39:21 · 1077 阅读 · 3 评论 -
element输入框与显示数据价格格式化
element输入框与显示数据价格格式化输入框输入时格式化输入框无法输入显示价格格式化法一:vue格式化包vue-text-format法二:管道过滤输入框输入时格式化<div> 价格: <el-input placeholder="请输入价格" v-model.trim="input1" oninput="value=va...原创 2019-12-11 11:06:57 · 6468 阅读 · 1 评论 -
for...in、for...of和forEach的区别
for...in、for...of和forEach的区别一、遍历对象二、遍历数组三、遍历的数组或对象包含原型属性或者自定义属性四、遍历时能否中断循环五、for...of特有六、其他遍历方式对象遍历数组遍历for…in遍历键名,for…of遍历键值,forEach遍历键名与值一、遍历对象var testArr={ code:'ac32', name:'joe', age:...原创 2019-11-25 17:22:25 · 592 阅读 · 0 评论 -
var、let、const的区别
var、let、const的区别:1、var声明的变量会挂载在window上,而let和const声明的变量不会var a = 1;console.log(a,window.a);let b = 10;console.log(b,window.b);const c = 100;console.log(c,window.c);结果:1 110 undefined100 u...原创 2019-11-25 14:00:14 · 191 阅读 · 0 评论 -
element switch开关在表格中阻止冒泡
element switch开关在表格中阻止冒泡问题解决办法问题表格有行单击事件,每行表格都有开关组件,点击开关组件的事件相应的是行单击的事件解决办法在el-switch 组件上加上@click.stop.native例子:<el-table :data="tableData" @cell-click="onCellClick"> <el-table-column ...原创 2019-11-11 09:30:36 · 1991 阅读 · 0 评论 -
typescript——变量
typescript——变量1、字符串类型let email:string=""2、模板字符串let msg:string=`my email is ${email}`3、布尔let isshow:boolean=false4、数字let age:number=205、数组let list:number[]=[1,2,3,4]6、元组let arr:[string...原创 2019-08-02 16:33:19 · 131 阅读 · 0 评论