自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(69)
  • 收藏
  • 关注

原创 前端开发 + Vue 2 + 卡片拖拽(带坐标系、左右互拖、多卡同容器)+ 学习参考

内容概要:本资源是基于 Vue 2 实现的卡片拖拽演示项目,深度融合坐标系机制,实现了左侧卡片区与右侧表格区的双向拖拽交互,同时支持卡片区内多卡片同容器操作。通过精准的坐标系计算,细腻地控制卡片的拖拽、定位与布局,直观呈现 Vue 2 框架下复杂交互的实现逻辑。适用人群:有 Vue 2 基础,想深入学习前端拖拽交互、坐标系应用的开发者;需在项目中集成类似功能的前端工程师;对前端交互效果实现感兴趣的技术爱好者。使用场景及目标:适用于个人技术学习、团队开发分享或项目功能预研场景。

2025-04-17 17:40:08 490

原创 css 练习02

【代码】css 练习02。

2025-04-14 17:10:38 165

原创 css 练习01

【代码】css 练习01。

2025-04-14 15:42:03 297

原创 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

原创 uniapp 微信小程序 使用ucharts

【代码】uniapp 微信小程序 使用ucharts。

2025-04-02 17:37:47 690

原创 Uniapp 实现微信小程序滑动面板功能详解

Uniapp 实现微信小程序滑动面板功能详解

2025-04-02 15:05:31 854

原创 uniapp 微信小程序项目中 地图 map组件 滑动面板

uniapp 微信小程序项目中 地图 map组件 滑动面板

2025-03-31 15:49:57 343

原创 前端在线预览,不做下载

【代码】前端在线预览,不做下载。

2025-03-13 14:00:58 108

原创 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

原创 FLIP 练习

【代码】FLIP 练习。

2024-11-15 16:40:43 138

原创 记录 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

原创 vue 展开收起查询列表

【代码】vue 展开收起查询列表。

2024-09-30 13:05:49 396 1

原创 vue3.2 + ant-design-vue 全屏事件记录

【代码】vue3.2 + ant-design-vue 全屏事件记录。

2024-09-19 10:15:06 347

原创 vue 3.2动态 组件

【代码】vue 3.2动态 组件。

2024-07-23 16:31:56 448

原创 grid实现table 原生js练习

【代码】grid实现table 原生js练习。

2024-07-10 17:48:34 172

原创 原生js 实现table 打印

原生js 实现table打印

2024-06-06 17:25:14 599

原创 记录uniapp + uview打包 iOS 兼容性问题

【代码】记录uniapp + uview打包 iOS 兼容性问题。

2024-05-31 09:54:05 372

原创 记录uniapp 中 打包安卓APP 遇到蒙层穿透问题

uniapp 安卓APP 蒙层穿透问题 网上试了很多方法不行,官网直接有方法,特此记录。

2024-05-29 11:02:31 200

原创 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

原创 vue2.x + echart 5.x 实现环形利用率图

【代码】vue2.x + echart 5.x 实现环形利用率图。

2024-05-07 14:26:50 523

原创 vue3.x + echarts 通过饼图绘制完成率

【代码】vue3.x + echarts 通过饼图绘制完成率。

2024-04-30 16:50:28 398

原创 vue 3 + vxetable 单元格合并demo

【代码】vue 3 + vxetable 单元格合并demo。

2024-04-24 09:36:25 528

原创 vue 3.2 + sv-table(二次封装vxe,使用将 sv 替换为 vxe 即可) 合并功能

【代码】vue 3.2 + sv-table(二次封装vxe,使用将 sv 替换为 vxe 即可) 合并功能。

2024-04-11 16:23:23 275

原创 用纯css实现material design风格的输入框

【代码】用纯css实现material design风格的输入框。

2024-02-29 10:19:39 423

原创 原生 js 练习 商品增加减少

【代码】原生 js 练习 商品增加减少。

2024-02-04 17:51:52 418

原创 vue 3.2 table 简易日历组件

【代码】vue 3.2 table 简易日历组件。

2024-01-26 15:49:27 691

原创 vue3.0 + antdv3.x 步骤条改造

【代码】vue3.0 + antdv3.x 步骤条改造。

2024-01-18 15:34:55 1201

前端开发 + Vue 2 + 卡片拖拽(带坐标系、左右互拖、多卡同容器)+ 学习参考

内容概要:本资源是基于 Vue 2 实现的卡片拖拽演示项目,深度融合坐标系机制,实现了左侧卡片区与右侧表格区的双向拖拽交互,同时支持卡片区内多卡片同容器操作。通过精准的坐标系计算,细腻地控制卡片的拖拽、定位与布局,直观呈现 Vue 2 框架下复杂交互的实现逻辑。 适用人群:有 Vue 2 基础,想深入学习前端拖拽交互、坐标系应用的开发者;需在项目中集成类似功能的前端工程师;对前端交互效果实现感兴趣的技术爱好者。 使用场景及目标:适用于个人技术学习、团队开发分享或项目功能预研场景。帮助开发者掌握 Vue 2 拖拽功能的底层实现,理解坐标系在元素位置计算、碰撞检测等交互逻辑中的应用,为实际项目开发积累经验,可直接作为功能模块参考或在此基础上扩展个性化需求(如数据绑定、动画效果增强等)。 其他说明:项目代码简洁、注释完备,兼顾实用性与学习性。无论是探究 Vue 2 交互特性,还是挖掘坐标系在前端的创意玩法,本资源都能提供有效参考,助力开发者提升前端交互开发的实战能力。欢迎下载代码深入研究,共同探讨前端交互的更多可能性!

2025-04-17

JavaScript 实现的 网页购物车功能

这是一个基于原生 JavaScript 实现的 网页购物车功能模块,包含商品分类导航、动态商品列表、购物车实时计算、结算交互等核心功能。适用于电商、餐饮、零售等需要商品选购和结算的 Web 项目

2025-04-11

uniapp中使用ucharts实现图表功能

本资源包含 UCharts 官方最新版 JS 文件及 uniapp 专用适配方案,支持折线图、柱状图、饼图等 12 种图表类型,提供动态交互、数据标签、主题切换等核心功能。代码体积仅 80KB,完美兼容 H5/APP/ 小程序多端环境

2025-04-02

前端开发中国地图资源China.json

在前端开发中我们使用echarts图表开发飞线图时 需要用到中国地图的地理数据,此数据包涵盖了 满足的地理数据,不管是html开发,还是框架开发(vue) 直接下载放再目录里面 html 使用中国地图JSON地理数据时 const chinaData = { 数据 } 在script中引入即可 <script src="./china.js"></script> 框架使用 直接 import使用

2024-03-29

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除