- 博客(12)
- 收藏
- 关注
原创 Vue3 + Element Plus 表格单元格多列级联合并
本文实现了一个Vue3 + Element Plus 表格合并功能,通过灵活控制了多列合并逻辑。核心点在于:明确合并列的顺序;判断分组起始行;统计 rowspan 并返回。这种方式可以广泛应用在任务表、订单表、报表系统等场景。
2025-08-29 17:34:21
993
原创 使用 Vue 3 实现高效文本批注功能
本文详细介绍基于Vue 3和Element Plus构建文本批注组件的实现方案。该组件提供文本高亮、批注管理等功能,包含动态显示添加按钮、侧边栏批注卡片展示、L型虚线连线等特性。通过SVG实现批注连线,采用Composition API组织逻辑代码,支持批注的增删改查操作。组件结构分为内容区、批注按钮和侧边栏三部分,利用getBoundingClientRect计算位置关系实现精准定位。实现要点包括文本选择监听、高亮样式控制、DOM节点操作以及响应式布局调整,为用户提供直观的批注交互体验。
2025-06-17 17:52:30
1455
原创 手撕一个拖拽功能的时间轴
在实际项目开发中,经常会遇到需要展示时间轴的场景。本文将介绍如何实现一个功能完善的交互式时间轴组件,包括时间拖拽、实时时间显示等功能。
2024-11-24 16:44:29
733
原创 0-1搭建vue3.0+vite+ts+less脚手架4——配置 ESLint、 Prettier、StyleLint、Husky、 LintStaged
这样就配置完毕啦,当我们使用 git commit -m “xxx” 时,lint-staged 会自动执行帮我们进行代码质量与风格的修复。配置完成之后我们对代码风格的配置只会使用prettier的配置,相当于将eslint中冲突的规则覆盖掉了。运行之后就会出现.husky文件夹,之后我们就可以配置在GItHook中执行的操作啦😀。我们还可以配置忽略文件,让 StyleLint 不对这些文件进行校验。我们还可以配置忽略文件,让 ESLint 不对这些文件进行校验。然后配置一个初始化 Hysky 的命令。
2024-09-08 22:39:39
2215
原创 前端数据可视化方案
官方网址:https://echarts.apache.org/zh/index.html简介:一个基于 JavaScript 的开源可视化图表库,提供直观、生动、可交互、可个性化定制数据可视化图表。
2023-08-23 21:59:19
1150
原创 路由权限设计如何实现
1:路由权限的核心包含3个东西,分别是用户、角色、菜单,用户和角色具备某种关联关系,角色和菜单又具备关联关系,所以用户和菜单就会通过角色产生关联关系。2:对应到后台页面上,首先我们创建好菜单,然后创建角色,在创建角色的时候可以给角色分配菜单,最后当创建用户账号时就可以给这个用户分配角色,
2023-07-23 11:18:59
471
原创 原生js实现简单的列表树
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0"> ...
2021-10-13 19:36:41
374
原创 js数组方法
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,...
2021-10-13 13:46:22
144
原创 css初始化样式
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,...
2021-08-02 18:44:48
174
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅