解决 Echarts 图 tooltip 层级太高穿透问题 问题场景:Echarts 图 tooltip 是自动轮播的,当点击某个区域出现弹窗时,tooltip和弹窗同时显示,没在遮罩层下面,查看tooltip的层级显示99999,所以这里改一下tooltip的层级。设置 extraCssText: "z-index: 2;
vue3前端加载动画 lottie-web 的简单使用案例 Lottie 是 Airbnb 发布的一款开源动画库,它适用于 Android、iOS、Web 和 Windows 的库。UED 提供动画 json 文件即可, 开发者就可以直接运用在 iOS、Android、Web 和 React Native之上,无需其他额外操作。1、SVG 渲染器支持的特性最多,也是使用最多的渲染方式。3、HTML 渲染器受限于其功能,支持的特性最少,只能做一些很简单的图形或者文字,也不支持滤镜效果。2、Canvas 渲染器就是根据动画的数据将每一帧的对象不断重绘出来;
vxe-table内置导出表格的提示message层级提升 业务场景:在el-dialog里有vxe-table表格,表格有前端导出功能,使用vxe-table自带的导出,但是导出的提示框层级低会被弹框盖住,无法显示到最顶层。
vxe-table编辑单元格动态插槽slot的使用 业务场景:表格中只有特定某一行的的单元格可以编辑,列很多,为每个列写个插槽要写很多重复代码,所以这里使用动态插槽,简化代码量。显示编辑图标,点击编辑图标隐藏。失去焦点保存调后台接口。2、把列数组里的插槽和field提取出来为循环使用做准备,如果直接使用导入进来的columns无法显示,所以需要处理后使用。1、后端返回的数据里可以编辑的行数据添加属性 edit: true;不可编辑的行数据里添加属性 edit: false;列名文件示例columns.js。
ECharts里x轴的name位置 x轴的name默认是显示在x轴的最后面,但是需求要把name 显示在x轴的上方,所以需要设置nameTextStyle,设置行高,padding和verticalAlign。
el-date-picker日期时间选择器限制可选的日期范围 业务场景:需要限制日期时间选择器可选择的日期,有两种模式,一种是已知范围,只能选已知范围内的日期,另一种是知道最近天数,只能选今天往前的天数内的日期,超出不能选。
html文件Js写输入框和弹框调接口jQuery 业务场景:需要使用写一个html文件,实现输入数字,保存调接口。1、使用 JS原生写法,fetchAPI调接口,使用 alert 方法弹框会阻塞线程,所以写了一个弹框。2、使用jQuery,先 npm install jquery,然后引入。1、使用 JS原生写法, fetchAPI调接口,使用。方法弹框会阻塞线程,所以写了一个。