- 博客(69)
- 收藏
- 关注
原创 前端开发 + Vue 2 + 卡片拖拽(带坐标系、左右互拖、多卡同容器)+ 学习参考
内容概要:本资源是基于 Vue 2 实现的卡片拖拽演示项目,深度融合坐标系机制,实现了左侧卡片区与右侧表格区的双向拖拽交互,同时支持卡片区内多卡片同容器操作。通过精准的坐标系计算,细腻地控制卡片的拖拽、定位与布局,直观呈现 Vue 2 框架下复杂交互的实现逻辑。适用人群:有 Vue 2 基础,想深入学习前端拖拽交互、坐标系应用的开发者;需在项目中集成类似功能的前端工程师;对前端交互效果实现感兴趣的技术爱好者。使用场景及目标:适用于个人技术学习、团队开发分享或项目功能预研场景。
2025-04-17 17:40:08
490
原创 Uniapp Vue 实现当前日期到给定日期的倒计时组件开发
在移动端应用开发中,倒计时功能是常见的交互需求,例如限时促销活动、订单超时提醒、考试倒计时等场景。本文将基于 Uniapp 框架,实现一个从当前日期到给定日期的倒计时组件,支持显示 HH:mm:ss 格式的剩余时间,并具备自动更新和资源释放机制。
2025-04-11 13:39:57
440
原创 CSS学习02 动态列数表格开发,解决多组数据布局与边框重合问题
在前端开发中,表格常用于展示结构化数据。当数据组的字段数量不统一时(如有的行包含 3 组数据,有的行包含 2 组或 1 组),传统固定列数的表格会出现结构错位、边框重合等问题。本文通过 HTML/CSS 规范方法,实现灵活适应不同数据组数的表格布局,确保视觉一致性和结构完整性。通过 HTML 表格的 colspan(跨列)属性动态调整列数,结合 CSS 的 border-collapse 合并边框,实现灵活且规范的表格布局。
2025-04-11 13:19:37
333
原创 CSS 学习01 定位、阴影与伪元素
通过这个案例,我们不仅实现了一个美观的按钮组件,更系统练习了 CSS 定位、盒模型、伪元素、过渡效果等核心技能。建议读者亲手敲代码并不断修改参数,观察样式变化规律,这是掌握 CSS 视觉设计的关键方法。
2025-04-11 10:28:16
538
原创 vxe-table4.6 + vue3.2 + ant-design-vue 3.x 实现对列的显示、隐藏、排序
vxe-table中的vxe-toolbar没有拖拽功能,故自己实现。
2025-04-10 17:18:36
292
原创 vue3.2 + vxetable4.6 + sortablejs 实现table和卡片之间的拖拽
在使用 SortableJS 库时,默认情况下,你不能直接在元素类型之间拖拽。SortableJS 设计为在同一类型的元素列表中拖拽。如果你想在不同的元素类型之间拖拽,例如从一个列表拖拽到另一个列表,或者从一个表格拖拽到另一个表格的不同行或列,你需要采取一些额外的步骤来实现这一功能。
2025-04-10 14:48:08
577
原创 vue3.2 +vxetable4.6 渲染大数据列,出现错乱问题处理方案
requestAnimationFrame是浏览器用于定时循环操作的一个接口,类似于setTimeout,主要用途是按帧对网页进行重绘,让各种网页动画效果(DOM动画、Canvas动画、SVG动画、WebGL动画)能够有一个统一的刷新机制,从而节省系统资源,提高系统性能,改善视觉效果。在vue项目中,有时候需要渲染大量的动态列,在我的项目中当我的列达到150个以上时,出现了列错乱问题,以下是我的示例截图。这个是在之前做动画的时候用过,抱着试试的心态,我修改了一下我的代码发现可以!
2025-04-09 11:35:42
403
原创 vue + uniapp 实现仿百度地图/高德地图/美团/支付宝 滑动面板 纯css 实现
使用百度地图、各种单车APP时,对地图上的滑动面板很感兴趣,于是根据自己的理解实现了一下。之前用的js实现,滑动的时候没有原生好。这一次用的css实现。
2025-04-09 10:46:10
821
2
原创 vue3.2 + vxetable + load_es 实现展开、收起、合并功能 优化
【代码】vue3.2 + vxetable + load_es 实现展开、收起、合并功能 优化。
2025-02-27 16:59:16
134
原创 vue3.2 + vxe-table4.x 实现多层级结构的 合并、 展开、收起 功能
【代码】vue3.2 + vxe-table4.x 实现多层级结构的 合并、 展开、收起 功能。
2025-02-27 14:50:08
312
原创 vue + uniapp + 高德地图实现微信小程序地图polyline、marker展示
【代码】vue + uniapp + 高德地图实现微信小程序地图polyline、marker展示。
2025-02-18 17:04:46
556
原创 记录 uniapp + uview 实现 h5 / app-plus 上传图片前端校验图片中的二维码,有缺陷偶尔识别不出来
【代码】记录 uniapp + uview 实现 h5 / app-plus 上传图片前端校验图片中的二维码,有缺陷偶尔识别不出来。
2024-10-29 09:35:02
182
原创 vue 2.0 使用 html2canvas + jspdf +ant-design-vue 1.x + echarts + 高德地图 导出数据报告
【代码】vue 2.0 使用 html2canvas + jspdf +ant-design-vue 1.x + echarts + 高德地图 导出数据报告。
2024-10-12 11:29:05
350
原创 vue3.x + echarts 5.x + ant-design-vue 4.x + monaco-editor v3 新增版本切换功能
【代码】vue3.x + echarts 5.x + ant-design-vue 4.x + monaco-editor v3 新增版本切换功能。
2024-05-10 11:48:46
409
原创 vue3.x + echarts 5.x + ant-design-vue 4.x + monaco-editor v3 实现 官网echarts在线编辑器效果
VMonacoEditor 组件。echarts 官网在线编辑器。
2024-05-10 10:27:32
656
原创 记录 vue create 《项目名》 + yarn 创建 vue 3 项目 使用 Monaco-editor 中的坑
【代码】记录 vue create 《项目名》 + yarn 创建 vue 3 项目 使用 Monaco-editor 中的坑。
2024-05-09 16:56:07
278
原创 vue 2.x 大屏自适应组件(摘录 https://gitee.com/zhangfucheng197/large-screen/tree/master/)
vue2.x 大屏自适应组件,找了很久,发现这个可以完美解决我的我问题。
2024-05-08 11:02:01
322
原创 vue2.x + echarts 5.x 实现环形利用率(有缺陷 不能实现小数和分配不均的情况,在此只做记录)
【代码】vue2.x + echarts 5.x 实现环形利用率(有缺陷 不能实现小数和分配不均的情况,在此只做记录)
2024-05-07 14:29:23
187
原创 vue 3.2 + sv-table(二次封装vxe,使用将 sv 替换为 vxe 即可) 合并功能
【代码】vue 3.2 + sv-table(二次封装vxe,使用将 sv 替换为 vxe 即可) 合并功能。
2024-04-11 16:23:23
275
前端开发 + Vue 2 + 卡片拖拽(带坐标系、左右互拖、多卡同容器)+ 学习参考
2025-04-17
JavaScript 实现的 网页购物车功能
2025-04-11
uniapp中使用ucharts实现图表功能
2025-04-02
前端开发中国地图资源China.json
2024-03-29
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人