- 博客(20)
- 收藏
- 关注
RSS订阅原创 react+antd组件库分，修改组件样式库不影响全局
摘要：本文介绍了如何通过局部样式修改组件库样式而不影响全局。通过创建独立样式文件index.less，使用:global嵌套和特定类名（.textBox）限定作用域，成功修改了Collapse组件的背景图、边距和文本溢出处理。在index.tsx中通过className引用样式表，实现了仅对当前页面组件样式的定制化调整，避免了全局样式污染。
2025-06-30 15:52:28
180
原创 Grafana二次开发重启项目纯前端 ！！
Grafana是一款支持多数据源的开源监控可视化平台，安装部署包括：1)下载安装包完成基础安装；2)修改配置文件(static_root_path)指向前端代码路径；3)从Git获取对应版本前端代码，使用Node 18.12.0执行yarn构建命令；4)重启服务解决可能出现的报错。该平台提供丰富的仪表盘功能和告警服务，可通过Docker快速部署，适合各类数据监控场景。操作中需注意版本匹配和路径配置，遇到问题可尝试重启服务解决。
2025-06-19 13:10:29
524
原创 文本框输入控制
摘要：实现移动端(vant)和PC端(原生textarea)的字符限制功能，当输入超过100字符时提示并自动截取。移动端使用van-field组件，通过selectionStart处理光标位置；PC端直接操作textarea元素，用substring截取文本。两者都考虑了光标在中间或末尾的不同情况，确保用户体验一致。
2025-05-26 10:25:39
379
原创 搜索时记录上次勾选数据
该代码实现了一个岗位/职位选择组件，主要功能包括： 支持按关键词搜索岗位/职位（多关键字空格分隔） 采用无限滚动加载分页数据 提供全选/取消全选功能 右侧显示已选项并可移除 支持取消或提交选择结果 关键特性： 复用组件同时支持岗位和职位选择 二次进入时可回显已选数据 搜索时自动重置分页 滚动触底自动加载下一页 选择结果可保存到后端 数据结构说明： 返回的分页数据包含： pageSize(每页数量) currentPage(当前页码) pageCount(总页数) rowCount(总记录数) data数组(
2025-05-26 10:21:20
184
原创 el-table合并表格
本文介绍了一个使用Element UI表格组件实现复杂数据展示的案例。前端通过自定义span-method方法处理表格行合并逻辑，根据flag和flagC标记控制不同列的合并显示。后端返回的数据包含评价信息、打分和反馈意见，前端通过扁平化处理原始数据并动态计算行跨度，实现了评价主体与对应评价项的合并展示。该方案特别处理了无反馈意见的情况，并根据是否有反馈意见动态显示相关列。最终实现了一个支持多级数据合并展示、包含动态表头控制的评价报表系统。
2025-05-26 10:15:16
147
原创 将弹窗的列表数据按照序号导出为一个表格
该代码实现了一个导出Excel文件的功能。主要流程包括：1)检查数据是否存在，无数据则提示；2)构造导出数据二维数组；3)设置Excel样式(字体、对齐、颜色等)；4)定义行高列宽；5)生成Excel文件并下载。导出文件包含人员序号、代码和姓名，文件名包含当前日期和渠道名称。使用了XLSX库处理Excel文件，并设置了表头特殊样式，最后通过saveAs方法实现文件下载。
2025-05-26 10:02:50
131
原创 合并表格导出
这段代码实现了一个表格导出功能，主要特点包括： 使用xlsx和xlsx-js-style库处理Excel文件 支持自定义表格样式：居中显示、宋体9号字、首行特殊样式（白字深色背景） 可设置列宽（20-40字符）和行高（30像素） 支持自定义文件名和工作表名 最终生成.xlsx格式文件并通过file-saver保存 该功能适用于需要将网页表格导出为格式规范的Excel文件场景。
2025-05-26 09:58:58
115
原创 vue2使用XLSX导出表格为指定样式
本文介绍了如何通过JavaScript的xlsx-js-style库实现Excel数据导出功能。代码首先检查待导出的员工数据数组，若无数据则提示用户。然后合并已处理和未处理员工数据，生成表格结构，设置表头样式、合并单元格、字体样式、背景色和边框等。最后通过XLSXST.write生成Excel文件流，并使用FileSaver.js的saveAs方法实现文件下载。整个过程包括数据预处理、样式配置和文件导出三个主要步骤。
2025-05-26 09:46:59
354
原创 grafana监控免登录
grafana监控作为子系统，需要在本系统中引入并实现免登录的情况。重启grafana服务即可。部署环境时将配置修改即可。
2024-04-12 10:50:52
947
原创 npm ERR! cb() never called!报错亲测有效
1、删除node_modules和package-lock.json。如果本来就是淘宝镜像，切换成原来的镜像。如果还是报错大概率是网速的问题了，重新按照上述步骤走一遍就可以啦。
2023-08-07 17:59:37
1258
原创 代码提交规范
chore: 不属于以上类型的其他类型(日常事务)style: 不影响程序逻辑的代码修改。build: 影响项目构建或依赖修改。refactor: 代码重构。ci: CICD 集成相关。revert: 版本回退。test: 添加测试代码。fix: 修复 Bug。docs: 文档修改。perf: 性能优化。
2023-08-07 17:48:49
122
原创 vue3的学习之路
vue2中的函数this指向vue组件实例，但是vue3中的this是undefined，所以在vue3的项目中几乎不用this，所有的东西都是在函数中返回。vue2中data函数返回对象数据是响应式的，但是setup中返回的对象数据不是响应式的就需要使用reactive转成响应式。2）ref可以转换简单数据类型为响应式数据对象，也支持复杂数据类型，使用的时候需要加上.value。如果能确定数据是对象且字段名称也确定，可以使用reactive转成响应式数据，其他一般使用ref。监听响应式数据中的一个数据。
2023-04-12 14:32:36
302
原创 基于Element-UI组件改造树形选择器（树形下拉框）
前言：项目中引用的前端组件库是elementui，需求是实现一个下拉列表框含树形结构。树形数据的的转换方法（使用递归）
2023-04-11 08:50:55
1046
原创 echarts的仪表盘
前端之路任重道远，这是我最近做的一个驾驶舱的仪表盘，过程实现比较繁琐，但好在效果不错，欢迎小伙伴提意见改进。上代码，因为要多次使用所以封装成了组件。
2023-04-08 11:35:09
588
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人