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

JavaScript甘特图 dhtmlx-gantt

news 来源：原创 2025/7/23 17:08:17

背景

需求是在后台中，需要用甘特图去展示管理任务相关视图，并且不用依赖vue，兼容JavaScript原生开发。最终使用dhtmlx-gantt，一个半开源的库，基础功能免费，更多功能付费。
甘特图需求如图：
在这里插入图片描述

调研对比不同的库可参考：https://juejin.cn/post/7337114587122597900?searchId=20241220110156B288C2A4E8F21C0FB170

功能分析

基础元素：左侧任务树 & 右侧图例任务 Progress
新增任务
删除任务
编辑任务

Gantt 的 NPM地址 docs.dhtmlx.com

官网 Gannt

优点： 功能丰富，支持多种视图和自定义样式，适合构建复杂的项目甘特图。

缺点： 库比较重，半开源，不支持后续定制开发

开发 Demo

1. 安装

npm i dhtmlx-gantt

2. 组件导入

<script lang="ts">
import { defineComponent, onMounted, ref } from 'vue';
import { gantt } from 'dhtmlx-gantt'; // 核心模块
import 'dhtmlx-gantt/codebase/dhtmlxgantt.css'; // 样式模块
....
</script>

3. 准备引入DOM

<template><div class="gantt-no" ref="ganttRef"></div>
</template>
<script>setup() {const ganttRef = ref<HTMLElement | null>(null);...return {ganttRef}}
</script>

4. 准备 MOCK 数据

const tasks = {data: [{ id: 1, text: '任务 1', start_date: '2021-10-17', duration: 3, progress: 0.6 },{ id: 2, text: '任务 2', start_date: '2021-10-20', duration: 10, progress: 0.4 }],links: []
}

参数简析：

整体数据是以对象的形式存放，其中的data是一个 Task[]，links是任务连线，其结构是 Link[]

单个 Task 可能包含以下的字段：

id: 任务唯一标识
text: 任务名称
start_date: 任务开始时间
duration: 任务时长
progress: 任务进度
parent: 父级的ID(树结构关系)
… 其他参数要查阅其官方文档

单个 Link 可能包含：

id: 连线的唯一标识
source: 源节点
target: 目标节点
type: 连线类型（0|1|2）标识是否有箭头

5. 初始化以及传入 tasks

onMounted((0 => {if (ganttRef.value) {gantt.init(ganttRef.value); // 初始化 DOMgantt.parse(tasks); // 传入 tasks}
})

6. 配置图例参数

禁用连线（本需求是不需要连线功能的）

gantt.config.show_links = false;

禁用工作进度拖拽（必须通过界面弹窗的方式进行修改信息）

gantt.config.drag_progress = false;

设置任务分段参数以及单位

gantt.config.duration_unit = 'day';
gantt.config.duration_step = 1;

配置左侧表格栏目

    gantt.config.columns = [{name: 'text',label: '任务名称',tree: true,width: '*',align: 'left',template: function (obj: any) {return obj.text;}},{name: 'start_date',label: '时间',width: '*',align: 'center',template: function (obj: any) {return obj.start_date;}},{name: 'progress',label: '进度',width: '*',align: 'center',template: function (obj: any) {return `${obj.progress * 100}%`;}}];参数简析： **ColumsItem[]**1. name: 'text' [String] , 索取的 tasks 里 **Task[]** 的 Task 的属性2. label: 'xxx' [String], 当前栏显示的文本3. tree: true [Boolean]，当前的任务是否为树结构这样4. align: [String: left|right|center]，label文本位置属性5. template: [Function]，函数类型，入参是 obj，即为当前的 Task 对象6. ... 其他参数要查阅文档

配置右侧表头日期栏

    gantt.config.xml_date = '%Y-%m-%d'; // 日期格式化的匹配格式gantt.config.scale_height = 90; // 日期栏的高度 const weekScaleTemplate = function (date: any) {const mouthMap: { [key: string]: string } = {Jan: '一月',Feb: '二月',Mar: '三月',Apr: '四月',May: '五月',Jun: '六月',Jul: '七月',Aug: '八月',Sept: '九月',Oct: '十月',Nov: '十一月',Dec: '十二月'};// 可以时使用dayjs 处理返回const dateToStr = gantt.date.date_to_str('%d');const mToStr = gantt.date.date_to_str('%M');const endDate = gantt.date.add(gantt.date.add(date, 1, 'week'), -1, 'day');// 处理一下月份return `${dateToStr(date)} 号 - ${dateToStr(endDate)} 号 (${mouthMap[mToStr(date) as string]})`;};const dayFormat = function (date: any) {const weeks = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];return weeks[Dayjs(date).day()];};gantt.config.scales = [{ unit: 'year', step: 1, format: '%Y' },{ unit: 'week', step: 1, format: weekScaleTemplate },{ unit: 'day', step: 1, format: dayFormat }];

添加今日的 Marker Line

    gantt.plugins({marker: true});gantt.addMarker({start_date: new Date(),text: '今日'});

任务菜单以及事件

右键菜单功能

// menu.vue
<template><div class="menu" :style="{ left: x + 'px', top: y + 'px' }"><el-menu@select="handleSelect"background-color="#545c64"text-color="#fff"active-text-color="#fff"><el-menu-item index="add">新增任务</el-menu-item><el-menu-item index="edit">编辑任务</el-menu-item><el-menu-item index="del">删除任务</el-menu-item></el-menu></div>
</template><script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({props: {x: {type: Number,default: 0},y: {type: Number,default: 0}},emits: ['menu-item'],setup(props, ctx) {const handleSelect = (action: string) => {ctx.emit('menu-item', action);};return {handleSelect};}
});
</script><style lang="less" scoped>
.menu {position: fixed;transition: all 1s ease;::v-deep(.el-menu-item) {height: 40px;line-height: 40px;width: 200px;}
}
</style>
// Gantt.vue
<template><transition name="el-fade-in-linear"><Menu :x="menuX" :y="menuY" v-show="menuVisible" @menu-item="handleItemClick" /></transition>
</template>
<script lang="ts">
const menuVisible = ref<boolean>(false); // 控制菜单显示
const menuX = ref<number>(0); // left
const menuY = ref<number>(0); // top
const handleItemClick = (item: any) => {menuVisible.value = false; // 隐藏菜单dialogVisible.value = true; // 显示编辑弹窗
};
gantt.attachEvent('onContextMenu',function (taskId, linkId, event) {var x = event.clientX + document.body.scrollLeft + document.documentElement.scrollLeft,y = event.clientY + document.body.scrollTop + document.documentElement.scrollTop;// 判断要是在树上的右键菜单才有效果if (taskId && event.target.className === 'gantt_tree_content') {console.log('task ContentMenu', taskId, linkId, event);menuX.value = x;menuY.value = y;menuVisible.value = true;}if (taskId || linkId) {return false;}return true;},{}
);
// 取消菜单显示
gantt.attachEvent('onEmptyClick',function (e) {//any custom logic heremenuVisible.value = false;},{}
);
</script>

效果
在这里插入图片描述

其他事件 (禁用原来自带的弹窗)

gantt.attachEvent('onBeforeLightbox',function (id) {console.log(1);return false; // 返回 false},{}
);

任务双击进入编辑事件

gantt.attachEvent('onTaskDblClick',function (id, e) {console.log('id', id, e);dialogVisible.value = true;return false;},{}
);

在这里插入图片描述

总结

具体代码，只处于一个 Dome 级别
至于npm源码方面，开源出来的功能从其官网看还是基本满足需求
库的稳定和功能升级方面，每周下载还是处于活跃的状态
官网Base是英文的，然后 Samples 样库例提供了很多功能的案例，需要发掘

JavaScript甘特图 dhtmlx-gantt

背景需求是在后台中，需要用甘特图去展示管理任务相关视图，并且不用依赖vue，兼容JavaScript原生开发。最终使用dhtmlx-gantt，一个半开源的库，基础功能免费，更多功能付费。甘特图需求如图： 调…...

编程日记 2025/7/23 17:08:17

基于无线传感器网络的无线光照强度采集系统（附详细使用教程+完整代码+原理图+完整课设报告）

🎊项目专栏：【Zigbee课程设计系列文章】（附详细使用教程完整代码原理图完整课设报告） 前言 👑由于无线传感器网络（也即是Zigbee）作为🌐物联网工程的一门必修专业课，具有…...

编程日记 2025/7/21 1:19:44

单元测试中创建多个线程测试 ThreadLocal

单元测试中创建多个线程测试 ThreadLocal 在单元测试中，可以通过以下方式创建多个线程来测试 ThreadLocal 的行为。目标验证 ThreadLocal 在多线程环境下是否能正确隔离每个线程的数据。实现步骤定义需要测试的类包含 ThreadLocal 对象的类，提供…...

编程日记 2025/7/22 21:35:45

【 Sonarqube】可视化Java项目单元测试覆盖率统计框架搭建

一、项目背景： 一个小公司的朋友反应他们那边Java项目单元测试有，但还没有可视化统计覆盖率数据，没法统计就不能直观的看到单测的覆盖率，Java的覆盖率统计框架还是比较成熟，部署起来也不是很难，下面我们逐…...

编程日记 2025/7/20 1:30:50

安装CentOS 1. 安装虚拟机 1.1下载虚拟机软件 VMware(VMware by Broadcom - Cloud Computing for the Enterprise) 我们使用的是VMware Workstation VirtualBox(Downloads – Oracle VirtualBox) 如果使用的是Windows系统，下载带for Windows hosts的版本 1.2…...

编程日记 2025/7/22 19:01:11

一起来看--红黑树

【欢迎关注编码小哥，学习更多实用的编程方法和技巧】红黑树是一种自平衡的二叉搜索树，广泛应用于计算机科学中，尤其是在实现关联数组和集合时。它的设计旨在确保在最坏情况下，基本动态集合操作（如插入、删除和查找&am…...

编程日记 2025/7/23 3:23:32

【Hackthebox 中英 Write-Up】通过 POST 请求绕过前端限制：基于 Cookie 的认证与数据提取实操指南

Bypassing Frontend Restrictions with POST Requests: A Practical Guide to Cookie-Based Authentication and Data Extraction 通过 POST 请求绕过前端限制 Objective | 目标 The purpose of this exercise is to understand how POST requests work and how to authentica…...

编程日记 2025/7/19 1:23:41

comctl32.dll没有被指定在window运行怎么解决？

一、文件丢失问题：comctl32.dll没有被指定在Windows上运行怎么解决？ comctl32.dll是Windows操作系统中的一个重要组件，它负责提供用户界面元素，如按钮、对话框和列表视图等。当系统提示“comctl32.dll没有被指定在Windows上运行”…...

编程日记 2025/7/20 23:56:10

EC-Final 2024游记

长篇流水账预警 Day -？ 某天上乒乓课时看到懋神群里了我们队问有时间打ec吗，才知道我们最终还是进ec了，也成为了我们学校唯一一支没有金牌的ec队伍，然而此时整个队伍板子都扔了，一个多月没做过题，我脑子就…...

编程日记 2025/7/21 8:34:31

我的Opencv

1.安装Opencv pip install opencv-python 2.读取图像 3.写图像 4. 显示图像 5.waitKey() 6.读视频并播放视频 7.写视频 8. 获取摄像头视频 9.色彩转换 # BGR to GRAY imgGRAY cv2.cvtColor(img, cv2.COLOR_BGR2GRAY) # BGR to RGB imgRGB cv2.cvtColor(img, cv2.COLOR_…...

编程日记 2025/7/23 1:45:41

Pandas-缺失数据处理

文章目录一. 简介1. 缺失数据简介2. NaN简介① 查看NaN，NAN，nan② 两个NaN也不相等③ isnull/isna方法④ notnull/notna 二. 加载缺失值1. 来源2. 加载数据，不包含默认缺失值3.加载数据，手动指定缺失值三.处理缺失值1. 加载数据…...

编程日记 2025/7/21 19:25:50

windows编译llama.cpp GPU版本

Build 指南 https://github.com/ggerganov/llama.cpp/blob/master/docs/build.md 一、Prerequire 具体步骤（以及遇到的坑）： 如果你要使用CUDA，请确保已安装。 1.安装最新的 cmake, git, anaconda， pip 配置pyt…...

编程日记 2025/7/21 22:23:38

绝美的数据处理图-三坐标轴-散点图-堆叠图-数据可视化图

clc clear close all %% 读取数据 load(MyColor.mat) %读取颜色包for iloop 1:25 %提取工作表数据data0(iloop) {readtable(data.xlsx,sheet,iloop)}; end%% 解析数据 countzeros(23,14); for iloop 1:25index(iloop) { cell2mat(table2array(data0{1,iloop}(1,1)))};data(i…...

编程日记 2025/7/18 20:02:48

计算机网络500题2024-2025学年度第一学期复习题库（选择、判断、填空）

一、单选题 1、（ ）是实现两个同种网络互连的设备 A. 网桥 B. 网关 C. 集线器 D. 路由器 2、10M以太网有三种接口标准，其中10BASE-T采用（ ） A. 双绞线 B. 粗同轴电缆 C. 细同轴电缆 D. 光纤 3、HDLC是哪…...

编程日记 2025/7/15 11:38:12

python学opencv|读取图像（二十二）使用cv2.polylines()绘制多边形

【1】引言前序学习进程中，已经掌握了使用pythonopencv绘制线段、矩形和圆形的基本操作，相关链接包括且不限于： python学opencv|读取图像（十八）使用cv2.line创造线段-CSDN博客 python学opencv|读取图像（…...

编程日记 2025/7/21 15:54:23

skywalking配置项indexReplicasNumber不生效问题

indexReplicasNumber: 的配置原来是 indexReplicasNumber: ${SW_STORAGE_ES_INDEX_REPLICAS_NUMBER:0}， 修改为 indexReplicasNumber: ${SW_STORAGE_ES_INDEX_REPLICAS_NUMBER:1} 但从es查询索引显示的副本数还是0，删除es中的数据，重启sk…...

编程日记 2025/7/13 1:23:07

2024年终回顾

前言很久没有更新博客，因为工作内容主要是内场开发，后来有点和互联网脱轨，断断续续上来看一下。这个总结应该也很简单，涉及以下的几个内容进行逐一说明一、就业问题这个问题可能很尖锐，从大环境来说，去…...

编程日记 2025/7/20 8:39:18

【深度学习】卷积网络代码实战ResNet

ResNet (Residual Network) 是由微软研究院的何凯明等人在2015年提出的一种深度卷积神经网络结构。ResNet的设计目标是解决深层网络训练中的梯度消失和梯度爆炸问题，进一步提高网络的表现。下面是一个ResNet模型实现，使用PyTorch框架来展示如何实现基本的…...

编程日记 2025/7/23 13:30:36

算法基础一：冒泡排序

一、冒泡排序 1、定义冒泡排序（英语：Bubble Sort）是一种简单的排序算法。它重复地走访过要排序的数列，一次比较两个元素，如果他们的顺序（如从大到小、首字母从A到Z）错误就把他们交换过来。 …...

编程日记 2025/7/22 9:21:56

第 29 章 - ES 源码篇 - 网络 IO 模型及其实现概述

前言本文介绍了 ES 使用的网络模型，并介绍 transport，http 接收、响应请求的代码入口。网络 IO 模型 Node 在初始化的时候，会创建网络模块。网络模块会加载 Netty4Plugin plugin。而后由 Netty4Plugin 创建对应的 transports&#xff0…...

编程日记 2025/7/19 22:53:43

工作流引擎之Flowable

一、概述 Flowable是一个使用Java编写的轻量级业务流程引擎，专为处理复杂业务流程而设计。作为业务流程管理（BPM）领域的重要工具，Flowable不仅支持BPMN 2.0标准的流程定义，还提供了丰富的API接口和可视化工具&#xf…...

编程日记 2025/7/21 17:16:40

学习threejs，THREE.CircleGeometry 二维平面圆形几何体

👨‍⚕️ 主页： gis分享者 👨‍⚕️ 感谢各位大佬点赞👍 收藏⭐ 留言📝 加关注✅! 👨‍⚕️ 收录于专栏：threejs gis工程师文章目录一、🍀前言1.1 ☘️THREE.CircleGeometry 圆形…...

编程日记 2025/7/19 13:41:15

网络编程UDP—socket实现（C++）

网络编程UDP—socket实现前言UDP客户端和服务端UDP使用场景UDP socket C代码示例服务端接收数据示例（bindrecvfrom 阻塞式接收信息）：bind 绑定-监听函数为什么一般都是监听所有网络接口呢？为什么需要用inet_addr进行转换&#x…...

编程日记 2025/7/20 1:25:38

个人用途虚拟机VM 17安装Ubuntu 16.04.5 图解

1.安装环境软件准备工作 1）下载免费版VMware Pro 17 https://softwareupdate.vmware.com/cds/vmw-desktop/ws/17.6.1/24319023/windows/core/VMware-workstation-17.6.1-24319023.exe.tar 2）Ubuntu 16.04.5 LTS 64位 64-bit PC (AMD64) desktop imag…...

编程日记 2025/7/19 4:52:07

音视频入门基础：MPEG2-TS专题（23）——通过FFprobe显示TS流每个packet的信息

音视频入门基础：MPEG2-TS专题系列文章： 音视频入门基础：MPEG2-TS专题（1）——MPEG2-TS官方文档下载音视频入门基础：MPEG2-TS专题（2）——使用FFmpeg命令生成ts文件音视频入门基础…...

编程日记 2025/7/20 19:25:19

安卓project级别build.gradle和主module的build.gradle

以穿山甲为例讲解如下图 gradle和gradle插件对应关系 Android Gradle 插件 8.7 版本说明 | Android Studio | Android Developers gradle对应在项目里的配置为 gradle插件对应的位置为...

编程日记 2025/7/3 2:22:26

【Qt】多元素控件：QListWidget、QTableWidget、QTreeWidget

目录 QListWidget 核心属性： 核心方法： 核心信号： 例子： QListWidgetItem QTableWidget 核心方法： 核心信号 QTableWidgetItem 例子： QTreeWidget 核心方法： 核心信号&#xff1a…...

编程日记 2025/7/18 20:34:49

服务器nfs文件共享

1. 配置 NFS 服务器（NFS Server）在 Ubuntu/Debian 上： sudo apt update sudo apt install nfs-kernel-server在 CentOS/RHEL 上： sudo yum install nfs-utils1.2 创建共享目录选择一个要共享的目录，并确保该目录的权限正确设置。例如，假设我们要共享 /srv/nfs 目录…...

编程日记 2025/7/17 7:47:10

【hackmyvm】soul靶机wp

tags: HMVrbash绕过图片隐写PHP配置解析 1. 基本信息^toc 文章目录 1. 基本信息^toc2. 信息收集3. 图片解密3.1. 爆破用户名3.2. 绕过rbash3.3. 提权检测 4. 获取webshell4.1. 修改php配置 5. www-data提权gabriel6. gabriel提取到Peter7. Peter提权root 靶机链接 https://ha…...

编程日记 2025/7/18 10:32:06

安装winserver2008R2虚拟机步骤

一、服务器系统介绍 1.1什么是服务器？ 服务器英文名称为“Server”，指的是网络环境下为客户机(Client)提供某种服务的专用计算机，服务器安装有网络操作系统(如Windows 2000 Server、Linux、Unix等)和各种服务器应用系统软件(如Web服务、电子…...

编程日记 2025/7/20 20:17:59

跟着 8.6k Star 的开源数据库，搞 RAG！

过去 9 年里，HelloGitHub 月刊累计收录了 3000 多个开源项目。然而，随着项目数量的增加，不少用户反馈：“搜索功能不好用，找不到想要的项目！” 这让我意识到，仅仅收录项目是不够的，还…...

编程日记 2025/7/21 16:32:35

RCE漏洞

一、课程知识点 1、远程代码执行漏洞原理与利用 2、常见的代码执行函数 3、常见的命令执行函数 4、常见的绕过姿势 5、命令执行漏洞防范二、技术目标 1、掌握命令执行漏洞的原理 2、掌握 PHP 命令执行和代码执行的相关函数 3、掌握常见的绕过姿势 4、掌握代码执行漏洞防御措施…...

编程日记 2025/7/16 21:20:45

数据通信系统的主要性能指标

1.码元速率 n 误码率 2.数据传输速率 n 误比特率 3.时延 n 往返时间 RTT 1. 码元速率 n 码元 ( Code element) n 码元是数字信号的计量单位 （ Signal element ）， 又称为符号（ Symbol ）。 n 码元是指在使用时域表示…...

编程日记 2025/7/20 5:02:40

C语言中的贪心算法

贪心算法（Greedy Algorithm）是一种在每一步选择中都采取当前最优解的算法，希望通过局部最优解的选择，最终得到全局最优解。它常用于解决最优化问题，如最小生成树、最短路径等。本文将从理论到实践，逐步引导…...

编程日记 2025/7/18 9:59:40

使用envoyfilter添加请求头

该envoyfilter实现了这样一个功能，如果请求头中含有Sw8，则添加请求头HasSw8: true。 1. 内嵌lua脚本 apiVersion: networking.istio.io/v1alpha3 kind: EnvoyFilter metadata:name: add-header-filternamespace: demo-bookinfo # 可根据实际情况调整命…...

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

【机器学习】回归

文章目录 1. 如何训练回归问题2. 泛化能力3. 误差来源4. 正则化5. 交叉验证 1. 如何训练回归问题第一步：定义模型线性模型： y ^ b ∑ j w j x j \hat{y} b \sum_{j} w_j x_j y^b∑jwjxj 其中，( w ) 是权重，( b )…...

编程日记 2025/7/18 7:27:34

Elasticsearch名词解释

文章目录 1.什么是Elasticsearch?2.什么是elastic stack(ELK)?3.什么是Lucene?4.什么是文档(document)？5.什么是词条(term)？6.什么是正向索引？7.什么是倒排索引？8.ES中的索引(index)9.映射(Mapping)10.DSL11.elastcisearch与my…...

编程日记 2025/7/19 1:13:07

把Huggingface下载的arrow数据集转化为json格式

Arrow2json 使用默认的Huggingface路径以allenai/tulu-3-sft-mixture数据集为例。使用load_dataset即可： from datasets import load_dataset# 加载数据集 dataset load_dataset("allenai/tulu-3-sft-mixture")# 指定保存路径 output_dir "~/…...

编程日记 2025/7/19 13:55:28

手机联系人查询添加操作

Android——添加联系人_android 添加联系人-CSDN博客上面连接添加联系人已测试是可以 Android : 获取、添加、手机联系人-ContentResolver简单应用_contentresolver 添加联系人-CSDN博客...

编程日记 2025/7/1 1:13:25

kkFileView集成springboot：使用自定义预览接口（非minio预览接口），发现无法预览资源

目录 1、背景2、原因分析3、解决办法 1、背景按照项目验收要求，需要对minio中存储的数据进行加密之前提供给kkFileView的预览地址都是获取的minio预览地址由于minio中的资源进行了加密处理，所以我们自定义预览接口（进行解密操作&#xff…...

编程日记 2025/7/22 19:09:03

C++ 设计模式：观察者模式（Observer Pattern）

链接：C 设计模式链接：C 设计模式 - 模板方法链接：C 设计模式 - 策略模式观察者模式（Observer Pattern）是一种行为设计模式，它定义了一种一对多的依赖关系，让多个观察者对象同时监听某一个主…...

编程日记 2025/7/23 10:08:27

Mono 和 IL2Cpp的区别

Mono特征: 标准项目中有Assembly-CSharp.dll , 但在更复杂的项目或特定配置中,可能会有其他.dll或结构变更在游戏的数据目录下看到一系列的.dll文件,这些文件的语言一般为中间语言 CE附加 , 查看是否有Mono.dll相关模块目录有MonoBleedingEdge文件夹 IL2Cpp 标准项目应该…...

编程日记 2025/7/20 14:02:21

Windows平台ROBOT安装

Windows环境下ROBOT的安装，按照下文进行部署ROBOT的前提是你的python已安装并且环境变量已设置好. 一、安装setuptools 1、下载后安装 https://pypi.python.org/pypi/setuptools/ 下载你需要的包 setuptools-75.6.0.tar.gz 解压下载的包在命令行中进入该包，敲击如下命令后…...

编程日记 2025/7/20 19:20:09

DevOps实战：用Kubernetes和Argo打造自动化CI/CD流程（2）

DevOps实战：用Kubernetes和Argo打造自动化CI/CD流程（2） 背景 Tips 翻遍国内外的文档，关于 Argo 作为 CI/CD 当前所有开源的文档，博客，argo官方文档。得出的结论是： argo官方给出的例子都相对…...

编程日记 2025/7/23 7:51:28

深入浅出 MyBatis | CRUD 操作、配置解析

3、CRUD 3.1 namespace namespace 中的包名要和 Dao/Mapper 接口的包名一致！ 比如将 UserDao 改名为 UserMapper 运行发现抱错，这是因为 UserMapper.xml 中没有同步更改 namespace 成功运行给出 UserMapper 中的所有接口，接下来一一对…...

编程日记 2025/7/23 4:00:57

Hutool 发送 HTTP 请求的几种常见写法

最简单的 GET 请求： String result HttpUtil.get("https://www.baidu.com");带参数的 GET 请求： // 方法1: 直接拼接URL参数 String result HttpUtil.get("https://www.baidu.com?name张三&age18");// 方法2: 使用 HashMap…...

编程日记 2025/7/23 15:59:21

计算机网络|数据流向剖析与分层模型详解

文章目录一、网络中的数据流向二、计算机网络通信模型1.OSI 模型2.TCP/IP 模型3.TCP/IP五层模型3.1 分层架构描述3.2各层地址结构3.3UDP数据包报头结构三、总结一、网络中的数据流向在计算机网络中，数据的流向是指数据从发送端到接收端的传输路径。数据流向涉及…...

编程日记 2025/7/21 17:36:18

在Java技术栈中，常用的分布式一致性算法和框架

在Java技术栈中，常用的分布式一致性算法和框架包括： Raft算法： 常用框架： etcd：虽然主要用Go语言编写，但可以通过Java客户端进行访问和操作。Apache Kafka：在其控制器选举中使用类似Raft的机…...

编程日记 2025/7/19 19:48:57

2024.12.29（进程线程实现并发服务器）

作业多进程多线程并发服务器实现一遍提交。服务器 #include <myhead.h> #define PORT 12345 #define IP "192.168.124.123"void *fun(void *fd) {int newfd *(int *)fd;char buff[1024];while(1){int res recv(newfd,buff,sizeof(buff),0);if(res 0){p…...

编程日记 2025/7/19 17:45:52

Docker完整技术汇总

Docker 背景引入在实际开发过程中有三个环境，分别是：开发环境、测试环境以及生产环境，假设开发环境中开发人员用的是jdk8，而在测试环境中测试人员用的时jdk7，这就导致程序员开发完系统后将其打成jar包发给测试人员后…...

编程日记 2025/7/17 17:39:51

背景