当前位置：首页 > news >正文

el-table 动态计算合并行

news 来源：原创 2025/6/22 15:12:57

原始表格及代码

在这里插入图片描述

<el-table:data="tableData"class="myTable"header-row-class-name="tableHead"
><el-table-column prop="date" label="日期"> </el-table-column><el-table-column prop="name" label="姓名"> </el-table-column><el-table-column prop="project" label="项目"> </el-table-column><el-table-column prop="address" label="地址" min-width="200"></el-table-column>
</el-table>

// 模拟数据接口请求并排序
getDataMock() {for (var i = 0; i < 10; i++) {let randomDay = Math.floor(Math.random() * 5 + 1);this.tableData.push({date: "2024-12-" + randomDay,name: "王小虎" + i,project: "项目" + i,address: "上海市普陀区金沙江路 " + i + " 弄",});}this.tableData.sort((a, b) => {let time1 = new Date(a.date).getTime();let time2 = new Date(b.date).getTime();return time1 - time2;});
},

.myTable {width: 700px;margin: 0 auto;border-radius: 20px;.tableHead {.el-table__cell {background-color: #bee7c5;color: #264f30;border-bottom: none;&:first-child {background: #435f5b;color: #fff;}}}.el-table__body {.el-table__row {.el-table__cell {background: #f7f7f7;border-bottom: 1px solid #dcdcdc;&:first-child {background: #acb2d9;color: #32405b;font-weight: bold;border-bottom: 1px solid #32405b;}}}}
}

合并行

需要动态计算表格数据的合并行数
如图所示，需要得到如下的 rowspan
计算表格数据每行的 rowspan

// 动态计算合并行的索引
getTableDataSpan(arr) {let spanData = []; // 数据数组的 rowspan 集合// rowspan > 1，合并行// rowspan == 1，单独行，不参与合并// rowspan == 0，被合并的行let lastRowIndex = 0; // 记录索引arr.forEach((item, index) => {if (index == 0) {// 第一行，默认认为不参与合并，记录为 1spanData.push(1);} else {if (item.date == arr[index - 1].date) {// 当前行的 date 与上一行的 date 相同，即当前行 的 rowspan 需要被记为 0spanData.push(0);// 向前找上次记录的索引，即需要当前行合并过去的目标行，使目标行的 rowspan 值加一spanData[lastRowIndex] += 1;} else {// 当前行的 date 与上一行的 date 不相等，则当前行的 rowspan 记录为 1spanData.push(1);// 暂且记录一下 lastRowIndex// 如果下一行与当前行的 date 值相同，就会合并到当前行，否则会更新 lastRowIndex 的值，进行下次对比lastRowIndex = index;}}});return {spanData: spanData,lastRowIndex: lastRowIndex,};
},

计算 span-method 属性

 <el-table:data="tableData"class="myTable"header-row-class-name="tableHead":span-method="spanMethod">...

spanMethod({ row, column, rowIndex, columnIndex }) {if (columnIndex === 0) {// 只有第一列需要合并，所以限定为 columnIndex === 0// 获取当前行的 rowspanlet rowspan = this.getTableDataSpan(this.tableData).spanData[rowIndex];let colspan = rowspan === 0 ? 0 : 1; // 被合并到其他行，需要为 colspan 赋值为 0，否则为 1return {rowspan: rowspan,colspan: colspan,};}
},

样式调整优化

上述代码得到如下效果
原因是被合并的行，删掉了首列，被赋予了 first-child 的样式

在这里插入图片描述

调整样式，为首列元素动态赋予类名

<el-table:data="tableData"class="myTable"header-row-class-name="tableHead":span-method="spanMethod":cell-class-name="cellClassName"
>
...

cellClassName({ row, column, rowIndex, columnIndex }) {if (columnIndex === 0) {return "colorBox"; // 首列添加类名}
},

.el-table__body {
.el-table__row {.el-table__cell {background: #f7f7f7;border-bottom: 1px solid #dcdcdc;&.colorBox {background: #acb2d9;color: #32405b;font-weight: bold;border-bottom: 1px solid #32405b;}}}
}

效果如图，会发现，动态赋予的 colorBox 类名，并没有被加到被合并的行的首列元素上

完整代码段

<template><div class="tableBox"><el-table:data="tableData"class="myTable"header-row-class-name="tableHead":span-method="spanMethod":cell-class-name="cellClassName"><el-table-column prop="date" label="日期"> </el-table-column><el-table-column prop="name" label="姓名"> </el-table-column><el-table-column prop="project" label="项目"> </el-table-column><el-table-column prop="address" label="地址" min-width="200"></el-table-column></el-table></div>
</template>
<script>
export default {name: "dataList",components: {},data() {return {tableData: [],};},mounted() {this.getDataMock();},methods: {getDataMock() {for (var i = 0; i < 10; i++) {let randomDay = Math.floor(Math.random() * 5 + 1);this.tableData.push({date: "2024-12-" + randomDay,name: "王小虎" + i,project: "项目" + i,address: "上海市普陀区金沙江路 " + i + " 弄",});}this.tableData.sort((a, b) => {let time1 = new Date(a.date).getTime();let time2 = new Date(b.date).getTime();return time1 - time2;});},cellClassName({ row, column, rowIndex, columnIndex }) {if (columnIndex === 0) {return "colorBox";}},spanMethod({ row, column, rowIndex, columnIndex }) {if (columnIndex === 0) {// 只有第一列需要合并，所以限定为 columnIndex === 0// 获取当前行的 rowspanlet rowspan = this.getTableDataSpan(this.tableData).spanData[rowIndex];let colspan = rowspan === 0 ? 0 : 1; // 被合并到其他行，需要为 colspan 赋值为 0，否则为 1return {rowspan: rowspan,colspan: colspan,};}},// 动态计算合并行的索引getTableDataSpan(arr) {let spanData = []; // 数据数组的 rowspan 集合// rowspan > 1，合并行// rowspan == 1，单独行，不参与合并// rowspan == 0，被合并的行let lastRowIndex = 0; // 记录索引arr.forEach((item, index) => {if (index == 0) {// 第一行，默认认为不参与合并，记录为 1spanData.push(1);} else {if (item.date == arr[index - 1].date) {// 当前行的 date 与上一行的 date 相同，即当前行 的 rowspan 需要被记为 0spanData.push(0);// 向前找上次记录的索引，即需要当前行合并过去的目标行，使目标行的 rowspan 值加一spanData[lastRowIndex] += 1;} else {// 当前行的 date 与上一行的 date 不相等，则当前行的 rowspan 记录为 1spanData.push(1);// 暂且记录一下 lastRowIndex// 如果下一行与当前行的 date 值相同，就会合并到当前行，否则会更新 lastRowIndex 的值，进行下次对比lastRowIndex = index;}}});return {spanData: spanData,lastRowIndex: lastRowIndex,};},},
};
</script>
<style lang="less" scoped>
.tableBox {background: #fff;padding: 50px 0;/deep/ .myTable {width: 700px;margin: 0 auto;border-radius: 20px;.tableHead {.el-table__cell {background-color: #bee7c5;color: #264f30;border-bottom: none;&:first-child {background: #435f5b;color: #fff;}}}.el-table__body {.el-table__row {.el-table__cell {background: #f7f7f7;border-bottom: 1px solid #dcdcdc;&.colorBox {background: #acb2d9;color: #32405b;font-weight: bold;border-bottom: 1px solid #32405b;}}}}}
}
</style>

el-table 动态计算合并行

原始表格及代码 <el-table:data"tableData"class"myTable"header-row-class-name"tableHead" ><el-table-column prop"date" label"日期"> </el-table-column><el-table-column prop"name" …...

编程日记 2025/6/22 15:12:57

【杭州电商商城系统开发建设】

杭州电商商城系统开发建设是一项综合性的工程，它涉及到多个方面的内容。以下是对杭州电商商城系统开发建设的详细分析： 需求分析：深入了解用户需求，包括用户群体特征、购物习惯、支付偏好等，为系统设计提供基础。明确…...

编程日记 2025/6/22 14:21:08

架构实践05-互联网架构模板

零、文章目录架构实践05-互联网架构模板 1、技术演进的方向 （1）技术演进的方向判断潮流派：热衷于新技术，紧跟技术潮流，但可能面临技术不成熟的风险和学习成本。保守派：强调稳定，对新技术持…...

编程日记 2025/6/20 10:36:42

家校通小程序实战教程10部门管理前后端连接

目录 1 加载后端的数据2 为什么不直接给变量赋值3 保存部门信息4 最终的效果5 总结现在部门管理已经完成了后端功能和前端开发，就需要在前端调用后端的数据完成界面的展示，而且在录入部门信息后需要提交到数据库里，本篇我们介绍一下前后端如…...

编程日记 2025/6/21 2:51:21

【前端面试题】书、定位问题、困难

看过什么书《JavaScript 高级程序设计（第 4 版）》（作者：Matt Frisbie） 这是一本深入学习 JavaScript 语言的经典书籍。它详细地涵盖了 JavaScript 的高级特性，包括原型链、闭包、异步编程等复杂概念。以闭…...

编程日记 2025/6/22 14:26:06

VSCode设置字体

参考文章：【面向小白】vscode最佳实践（2）—— 字体设置（fira code更纱黑体），这篇文章末尾给了安装字体的链接。配置的字体还是很好看的。 ‘Fira Code Retina’, ‘Sarasa Mono Sc’ 需要注意的一个点&am…...

编程日记 2025/6/20 1:49:52

《机器学习》2.4假设检验 t分布 F分布

目录 t发布注意是这个东西服从t分布数据服从t分布通常是在以下情况下： 以下是一些具体的例子，说明在何种情况下数据会服从t分布： t检验交叉验证t检验样本方差编辑 F分布（fisher Friedman检验是一种非参数统计方法&a…...

编程日记 2025/6/22 12:09:19

Mysql之视图

MySQL 视图（View） 1. 概念视图是一个虚拟的表，它是基于 SELECT 查询的结果集。视图不存储实际数据，而是动态地从基表中提取数据。视图可以简化复杂查询、提高数据安全性（限制访问特定列或行）以及提供数据…...

编程日记 2025/6/3 3:59:57

kafka学习笔记

kafka消息中间件精讲 - B站动力节点 JDK17在Windows安装及环境变量配置超详细的教程 Windows 多版本java 装多个版本jdk Windows同时安装多个JDK jdk17下载与安装教程（win10），超详细 jdk17-archive-downloads 如何在IDEA中配置指定JDK版…...

编程日记 2025/6/4 8:48:05

【保姆级教程】基于OpenCV+Python的人脸识别上课签到系统

【保姆级教程】基于OpenCVPython的人脸识别上课签到系统一、软件安装及环境配置1. 安装IDE：PyCharm2. 搭建Python的环境3. 新建项目、安装插件、库二、源文件编写1. 采集人脸.py2. 训练模型.py3. 生成表格.py4. 识别签到.py5. 创建图形界面.py 三、相关函数分析1.…...

编程日记 2025/5/31 14:50:58

LVS能否实现两台服务器的负载均衡

LVS能否实现两台服务器的负载均衡是的，LVS（Linux Virtual Server）可以实现两台服务器的负载均衡，并且它非常适合这种场景。 LVS（Linux Virtual Server）简介： LVS 是一种基于 Linux 的负载均…...

编程日记 2025/5/30 23:50:12

智能人体安全防护：3D 视觉技术原理、系统架构与代码实现剖析

随着工业化程度的提高，生产安全已成为企业关注的重点。尤其是在一些存在禁区的工业厂区和车间，人员误入或违规进入将带来严重的安全隐患。为了解决这一问题，迈尔微视推出了智能人体安全检测解决方案，为企业提供全方位的人员安全监…...

编程日记 2025/6/22 6:28:11

JAVA后端实现全国区县下拉选择--树形结构

设计图如图： 直接上代码数据库中的格式： JAVA实体类： Data public class SysAreaZoningDO {private Long districtId;private Long parentId;private String districtName;private List<SysAreaZoningDO> children; } MapperSQL语句…...

编程日记 2025/6/21 13:47:29

DVWA及其他常见网络靶场

常见网络靶场 Metasploitable2 介绍： Metasploitable2 是一个用于安全培训和测试渗透测试工具的虚拟靶机。它故意配置了许多已知的安全漏洞，涵盖了操作系统、网络服务等多个方面。基于 Ubuntu Linux 操作系统构建，包含了如 Apache、MySQL、FT…...

编程日记 2025/6/22 7:02:39

API接口安全：电商数据保护的坚固防线

随着电子商务的蓬勃发展，电商平台的数据安全和隐私保护成为了至关重要的议题。API（应用程序编程接口）作为电商平台与外部系统交互的桥梁，其安全性直接关系到整个平台的数据保护能力。本文将从API接口安全的重要性、面临的安全威胁…...

编程日记 2025/6/20 18:04:22

springboot437校园悬赏任务平台(论文+源码)_kaic

摘要使用旧方法对校园悬赏任务平台的信息进行系统化管理已经不再让人们信赖了，把现在的网络信息技术运用在校园悬赏任务平台的管理上面可以解决许多信息管理上面的难题，比如处理数据时间很长，数据存在错误不能及时纠正等问题。这次开发的校…...

编程日记 2025/5/30 15:52:18

可视化报表如何制作？一文详解如何用报表工具开发可视化报表

在如今这个数据驱动的商业时代，众多企业正如火如荼地推进数字化转型，力求在激烈的市场竞争中占据先机。然而，随着业务规模的扩大和运营复杂度的提升，企业的数据量爆炸式增长，传统报表格式单一、信息呈现密集且不易解读…...

编程日记 2025/6/22 15:09:55

STM32 HAL库之SDIO例程 Micro SD卡 - 2

1、硬件图 2、示例代码根据提示配置SDCLK为72/3 24MHz。 static void MX_SDIO_SD_Init(void) {/* USER CODE BEGIN SDIO_Init 0 */SD_InitTypeDef Init;Init.ClockEdge SDIO_CLOCK_EDGE_RISING;Init.ClockBypass SDIO_CLOCK_BYPASS_DISABLE;Init.ClockPo…...

编程日记 2025/6/19 21:07:49

架构实践02-高性能架构模式

零、文章目录架构实践02-高性能架构模式 1、高性能数据库集群：读写分离 （1）引言背景：随着业务的发展和数据的增长，单个数据库服务器难以满足需求，必须考虑数据库集群。目的：介绍高性能数…...

编程日记 2025/5/29 11:14:07

leetcode-73.矩阵置零-day5

class Solution {public void setZeroes(int[][] mat) {int m mat.length, n mat[0].length;// 1. 扫描「首行」和「首列」记录「首行」和「首列」是否该被置零boolean r0 false, c0 false;for (int i 0; i < m; i) {if (mat[i][0] 0) {r0 true;break;}}for (int j …...

编程日记 2025/6/2 16:13:38

Docker与虚拟机：虚拟化技术的差异解析

在信息技术飞速发展的今天，虚拟化技术已成为现代IT架构不可或缺的一部分。而虚拟化从技术层面划分则分为以下几种： 完全虚拟化：虚拟机能够完全模拟底层硬件的特权指令的执行过程，客户操作系统无须进行修改。硬件辅助虚拟化&#…...

编程日记 2025/5/31 8:23:23

数据结构——ST表

ST表的定义 ST表，又名稀疏表，是一种基于倍增思想，用于解决可重复贡献问题的数据结构倍增思想这里列举一个去寻找一个区间内的最大值的例子因为每次会将将区间增大一倍，所以才被称之为倍增思想 ，这种思想十分好用…...

编程日记 2025/6/20 13:56:25

flutter命令行直接指定设备

> flutter driver Found 3 connected devices:sdk gphone16k x86 64 (mobile) • emulator-5554 • android-x64 • Android 15 (API 35) (emulator)Linux (desktop) • linux • linux-x64 • Ubuntu 22.04.5 LTS 6.8.0-49-genericChrome (…...

编程日记 2025/6/22 15:10:54

【STM32】RTT-Studio中HAL库开发教程九：FLASH中的OPT

文章目录一、概要二、内部FLASH排布三、内部FLASH主要特色四、OTP函数介绍五、测试验证一、概要 STM32系列是一款强大而灵活的微控制器，它的片内Flash存储器可以用来存储有关代码和数据，在实际应用中，我们也需要对这个存储器进行读写操作。…...

编程日记 2025/6/22 15:04:51

COLA学习之代码规范（二）

小伙伴们，你们好，我是老寇，上一节，我们学习了DDD相关术语，继续跟老寇学习COLA代码规范代码规范包命名层次包名功能必选Adapter层web处理页面请求Controller否Adapter层wireless处理无线端适配否Adapter层wap处理…...

编程日记 2025/6/22 0:33:10

【优选算法】二分算法（在排序数组中查找元素的第一个和最后一个位置，寻找峰值，寻找排序数组中的最小值）

二分算法简介： 提到二分我们可能都会想起二分查找，二分查找要求待查找的数组是有序的，与我们今天讲的二分算法不同，并不是数组元素严格按照有序排列才可以使用二分算法，只要数组中有一个点可以将数组分为两个部分&…...

编程日记 2025/6/21 12:32:42

数据结构-排序（来自于王道）

排序的基本概念插入排序在这个算法中，除了输入的数组本身，没有使用额外的数据结构来存储数据，所有的操作都是在原数组上进行的。因此，无论输入数组的大小 n 是多少，算法执行过程中所占用的额外空间是固定的&#xff…...

编程日记 2025/6/22 14:13:58

用 Python 实现经典的 2048 游戏：一步步带你打造属于你的小游戏！

用 Python 实现经典的 2048 游戏：一步步带你打造属于你的小游戏！（结尾附完整代码） 简介 2048 是一个简单而又令人上瘾的数字拼图游戏。玩家通过滑动方块使相同数字的方块合并，目标是创造出数字 2048！在这篇…...

编程日记 2025/6/20 2:00:38

《C++：计算机视觉图像识别与目标检测算法优化的利器》

在当今科技飞速发展的时代，计算机视觉领域正经历着前所未有的变革与突破。图像识别和目标检测作为其中的核心技术，广泛应用于安防监控、自动驾驶、智能医疗等众多领域，其重要性不言而喻。而 C语言，凭借其卓越的性能、高效的资源控…...

编程日记 2025/6/3 8:05:50

医学分割数据集白内障严重程度分割数据集labelme格式719张3类别

数据集格式：labelme格式(不包含mask文件，仅仅包含jpg图片和对应的json文件) 图片数量(jpg文件个数)：719 标注数量(json文件个数)：719 标注类别数：3 标注类别名称:["normal","severe","mi…...

编程日记 2025/6/3 2:27:33

VirtIO实现原理之数据结构与数据传输演示（4）

接前一篇文章：VirtIO实现原理之数据结构与数据传输演示（3）本文内容参考： VirtIO实现原理——vring数据结构-CSDN博客 VirtIO实现原理——数据传输演示-CSDN博客特此致谢！一、数据结构总览 2. 相关数据结构前文书介绍了《Virtual I/O Device (VIRTIO) Version 1.3…...

编程日记 2025/5/27 20:42:45

C语言：详解指针最终篇（3）

一.字符指针变量在指针的类型中我们知道有一种指针类型为字符指针char*。一般我们这样使用： 我们来看另一种使用方式： 这个常量字符串就相当于它本身首字符的地址，收地址加上方括号下标就可以访问该表达式中对应下标的元素。可以把该表达式…...

编程日记 2025/5/31 14:03:30

03篇--二值化与自适应二值化

二值化定义何为二值化？顾名思义，就是将图像中的像素值改为只有两种值，黑与白。此为二值化。二值化操作的图像只能是灰度图，意思就是二值化也是一个二维数组，它与灰度图都属于单信道，仅能表示一种色调…...

编程日记 2025/6/21 19:24:52

Java 小抄｜解析 JSON 并提取特定层级数据

文章目录前言环境准备依赖库示例代码JSON 数据Java 类定义解析 JSON 数据代码解释结论前言在日常开发中，我们经常需要从 JSON 数据中提取特定的信息。本文将介绍如何使用 Java 和 Gson 库解析 JSON 数据，并通过流式处理提取特定层级的数据。我们将…...

编程日记 2025/6/3 13:26:12

qt 设置系统缩放为150%，导致的文字和界面的问题

1 当我们设置好布局后，在100%的设置里面都是正常的，但是当我们修改缩放为150%后，字体图标，界面大小就出现问题了，这就需要我们设置一些参数。 QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);QCoreAppl…...

编程日记 2025/6/1 5:24:11

【echarts】数据过多时可以左右滑动查看（可鼠标可滚动条）

1. 鼠标左右拖动在和 series 同级的地方配置 dataZoom： dataZoom: [{type: inside, // inside 鼠标左右拖图表，滚轮缩放； slider 使用滑动条start: 0, // 左边的滑块位置，表示从 0 开始显示end: 60, // 右边的滑块位置&#xf…...

编程日记 2025/5/31 5:57:36

深度学习入门课程学习笔记（第25周）

摘要本周报的目的在于汇报第25周的学习成果，本周主要聚焦于基于深度学习的目标检测领域算法的总体框架的学习。在这本周的学习中，内容主要涵盖了目标检测算法的发展历程，包括发展历程和发展阶段，然后纤细说明了目标检测算法的…...

编程日记 2025/6/20 12:10:34

【Python】Matplotlib基本图表绘制

目录 Matplotlib基本图表绘制折线图更多外观外观类型颜色线条样式图例位置使用本地字体散点图条形图横向条形图直方图频率分布直方图 Matplotlib基本图表绘制折线图 from matplotlib import pyplot as plt import matplotlib #字典类型的字体预设，键值对依次…...

编程日记 2025/6/4 4:12:17

【1211更新】腾讯混元Hunyuan3D-1文/图生3D模型云端镜像一键运行

目录项目介绍显存占用 11月21 新增纹理烘焙模块Dust3R 烘焙相关参数： AutoDL云端镜像启动说明标准模型下载【1212更新】腾讯混元Hunyuan3D-1文图生3D模型云端镜像一键运行项目介绍 https://github.com/Tencent/Hunyuan3D-1 腾讯混元 3D 生成模型,支持…...

编程日记 2025/6/20 18:51:43

工业大数据分析算法实战-day05

文章目录 day05分而治之中的MARS算法神经网络逼近能力解释 day05 今天是第5天，昨日从统计分析开始利用统计学的知识判断当前样本的分布以及估计总体的参数和假设检验的情况，以及介绍了线性回归算法的相关优化点，但是毕竟线性回归是线性划分的…...

编程日记 2025/5/29 15:01:24

Go 语言结构

Go 语言结构 Go 语言，也称为 Golang，是一种由 Google 开发和支持的静态类型、编译型编程语言。它于 2009 年首次发布，旨在提高多核处理器、网络资源和大型代码库的性能。Go 语言以其简洁的语法、并发支持和强大的标准库而闻名，特别适合构建高性能的网络服务和分布式系统。…...

编程日记 2025/6/1 15:41:05

【Python篇】PyQt5 超详细教程——由入门到精通（序篇）

文章目录 PyQt5 超详细入门级教程前言序篇：1-3部分：PyQt5基础与常用控件第1部分：初识 PyQt5 和安装1.1 什么是 PyQt5？1.2 在 PyCharm 中安装 PyQt51.3 在 PyCharm 中编写第一个 PyQt5 应用程序1.4 代码详细解释1.5 在 PyCharm 中运…...

编程日记 2025/6/21 10:51:19

9_less教程 --[CSS预处理]

LESS（Leaner Style Sheets）是一种CSS预处理器，它扩展了CSS语言，增加了变量、嵌套规则、混合（mixins）、函数等功能，使得样式表的编写更加灵活和易于维护。下面是一些LESS的基础教程内容&#xff…...

编程日记 2025/6/20 13:44:00

macOS：安装第三方软件

基于安全性考虑，Mac 系统通常不允许安装那些从网络上下载下来的第三方软件包。比如，在打开镜像盘时，报错为“该镜像已损坏，请移至废纸篓”，或者打开软件时提示“XXX 已损坏，打不开。您应该将它移到废纸篓”…...

编程日记 2025/6/2 0:03:05

HTML+CSS+Vue3的静态网页，免费开源，可当作作业使用

拿走请吱一声，点个关注吧，代码如下，网页有移动端适配 HTML <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width…...

编程日记 2025/6/20 12:58:12

昇思25天学习打卡营第33天|共赴算力时代

文章目录一、平台简介二、深度学习模型2.1 处理数据集2.2 模型训练2.3 加载模型三、共赴算力时代一、平台简介昇思大模型平台，就像是AI学习者和开发者的超级基地，这里不仅提供丰富的项目、模型和大模型体验，还有一大堆经典数据集任你挑。…...

编程日记 2025/5/29 2:14:53

IAR环境下STM32静态库编译及使用

IAR环境下STM32静态库编译及使用前言最近了解到了STM32的静态库与动态库，在此记录一下STM32静态库的生成与使用。静态库的作用主要是对代码进行封装及保护，使其他使用者只知其然而不知其所以然，因为封装后的静态库只有.h文件没有.c文件。…...

编程日记 2025/6/2 0:59:49

前端如何性能优化

前端性能优化是提高网页加载速度和响应速度的重要手段。优化前端性能不仅能提升用户体验，还能提高SEO排名，降低服务器负担，节省带宽等。下面是一些常见的前端性能优化方法： 1. 减少 HTTP 请求每个页面资源（如图片、…...

编程日记 2025/6/20 0:26:13

【开源】为Stable Diffusion工作流程提供的一个更加灵活易用的Web界面

一个开源项目，旨在为Stable Diffusion工作流程提供一个更加灵活、易用的Web界面。这个项目特别适用于图像生成和编辑，具有以下几个显著特点： 分层和非破坏性编辑：OpenDream支持非破坏性编辑，允许用户在保留原始图像数据…...

编程日记 2025/5/27 6:43:11

安全见闻（1）

Target 开阔见闻，不做井底之蛙 Trial 建议前期小白到中级红队：把python学好 C\C：偏向底层，适合逆向，不适合前期web渗透编程语言 C语言: 一种通用的、面向过程的编程语言，广泛应用于系统软件和嵌入…...

编程日记 2025/5/27 0:38:08

原始表格及代码

合并行

样式调整优化

完整代码段

相关文章：