- 博客(22)
- 收藏
- 关注
RSS订阅原创 vue 项目实现按住上下拖动效果
该代码实现了一个可拖动调整高度的界面分区组件。主要功能包括：通过鼠标或触摸事件拖动分隔线调整上下区域高度，具有最小/最大高度限制(100-600px)，拖动时提供视觉反馈(光标变化、阴影效果)和动画提示。组件采用Vue单文件结构，包含模板(上下分区布局)、脚本(事件处理逻辑)和样式(视觉效果)。支持移动端触摸操作，并优化了拖动时的用户体验(禁用文本选择、平滑过渡等)。
2025-06-10 09:36:03
375
原创 vue项目 用print（）打印的页面里面有图片 但是打印预览的时候图片不显示
本文介绍了两种解决图片不显示问题的打印方法。第一种方法通过获取打印内容并拼接样式，然后在新窗口中注入内容并调用打印功能，最后关闭窗口。第二种方法使用iframe，将需要打印的内容写入隐藏的iframe中，并在iframe加载完成后执行打印操作，最后移除iframe。这两种方法都能有效解决图片在打印时不显示的问题，确保打印内容的完整性。
2025-05-21 09:08:40
206
原创 vue 遍历多个接口，得到所有的值以后再进行下一步
vue 遍历多个接口，得到所有的值以后再进行下一步，vue异步操作，async await 的使用
2025-03-25 09:41:06
160
原创 vue项目中，动态src引入图片，并且js根据文件名后缀，判断文件图片、视频、文档、pdf等类型的方法
2、根据返回的结果，直接将文件名命名为返回的结果，比如我有个图片类型的文件，经过上述的方法，返回的是image，那我直接要显示的图片名称就为image,然后动态引入图片。vue根据文件地址，获取后缀，根据后缀判断类型，然后根据类型动态展示不同类型的照片。1、处理后缀，根据后缀判断类型。
2023-07-18 14:55:46
3895
1
原创 前端图片无损压缩在线工具
目的：为了提高页面加载速度，降低服务器压力要求：ui给的切图，都需要经过压缩，再放到项目目录中工具地址：https://tinypng.com/操作步骤：点击上传或者直接拖拽到里面，然后直接点击下载就行...
2021-09-02 11:44:37
200
原创 滑动加载更多 vue-data-loading
<vue-data-loading :loading="loading" :listens="['pull-down', 'infinite-scroll']" @infinite-scroll="infiniteScroll" @pull-down="pullDown"><!--your data here--></vue-data-loading> <div slot="infinite-scroll-loading">加载中...</div.
2021-09-02 10:44:34
596
原创 css实现图片在固定的盒子里等比例显示
使用object-fit:cover .img-box { height: 210px; width: 210px; border-radius: 8px; overflow: hidden; > img { height: 100%; width: 100%; object-fit: cover; } }
2021-08-26 11:58:02
1721
原创 vue实现左滑删除功能
实现效果如下：思路： 通过touch事件获取起始位置跟终点位置，通过这段距离的差值进行判断，进行左滑的实现html<ul class="listBox"> <li v-for="(item, index) in commentList" :key="index"> <div class="list-item" data-type="0"> <div ...
2021-08-26 11:49:32
729
原创 pc端在使用element-ui中的table表格时出现表格对不齐，解决方法
1、用element-ui中的table表格时出现表格对不齐解决方案：body.el-tableth.gutter{display:table-cell!important}然后就ok了
2021-08-26 11:19:52
877
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人