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

构建高效多标签选择组件：从设计到实现

news 来源：原创 2025/8/25 20:24:09

在现代Web应用中，多标签选择功能已成为常见需求，特别是在内容分类、文章标签、用户兴趣选择等场景。本文将深入解析一个完整的多标签选择实现方案，涵盖交互设计、核心功能和优化技巧。

组件功能概述

这个多标签选择组件提供以下核心功能：

  • 可展开/折叠的下拉选项框

  • 多标签选择（最多3个）

  • 已选标签可视化展示

  • 标签删除功能

  • 良好的键盘交互支持

  • 点击外部区域自动收起

核心架构解析

1. 标签渲染引擎

function labelRender(data) {let labelOPtionStr = ``;for (let i in data) {labelOPtionStr += `<div class="option_value" data-id="${data[i].id}" onclick=toggleTally(this)>${data[i].name}</div>`;}$(".option_box").html(labelOPtionStr);
}

技术亮点：

  • 使用模板字符串动态生成选项HTML

  • 通过data-id属性关联业务数据

  • 内联事件绑定简化代码结构

2. 下拉框状态管理

function toggleDropdown(show) {const $arrows = $(".arrows");const isShow = show ?? ($arrows.attr('data-arrow') === 'true');$arrows.toggleClass('arrowhead', isShow).attr('data-arrow', isShow ? 'false' : 'true');$(".option_box").stop(true, true)[isShow ? 'slideDown' : 'slideUp'](300);
}

交互细节：

  • 使用CSS类控制箭头方向

  • data-arrow属性维护状态

  • jQuery动画实现平滑展开/收起

  • 支持强制显示/隐藏参数

3. 标签选择逻辑

function toggleTally(element) {const id = $(element).attr("data-id");$(element).addClass("option_backColor");const index = tallyArr.indexOf(id);if (index === -1) {if (tallyArr.length >= 3) {return; // 限制最多选择3个}tallyArr.push(id);} else {tallyArr.splice(index, 1);}TallyRender(tallyArr);
}

业务逻辑：

  • 实现标签的选中/取消选中

  • 限制最大选择数量

  • 实时更新UI状态

关键实现技巧

1. 全局点击监听

$(document).on('click', function (e) {const $target = $(e.target);const isInside = $target.closest('#MultiSelect, .option_box').length > 0;if (!isInside && $('.arrows').attr('data-arrow') === 'false') {toggleDropdown(false);$('.typeInput').blur();}
});

用户体验优化：

  • 点击组件外部自动收起下拉框

  • 同时处理输入框失焦

  • 精确判断点击区域

2. 标签渲染与同步

function TallyRender(arr) {// 同步选项高亮状态$(".option_value").removeClass("option_backColor").filter((_, el) => arr.includes($(el).data('id'))).addClass("option_backColor");// 渲染已选标签const html = arr.length ? [...new Set(arr)] // 去重.map(id => {const label = tagData.find(item => item.id == id);return label ? `<div class="tally" style="background-color:${label.back};" data-id="${label.id}"><p style="color:${label.color};">${label.name}</p><img src="./img/close (1).png" class="tally_del" onclick="removeLabel(${id})"/></div>` : '';}).join('') : '<p class="option_prompt">请选择标签</p>';$("#MultiSelect").html(html);$('.typeInput').val(tallyArr.join());
}

渲染优化：

  • 选项与已选标签状态同步

  • 数组去重处理

  • 空状态提示

  • 隐藏域值自动更新

总结

这个多标签选择组件实现展示了如何构建一个：

  • 用户友好：直观的交互设计

  • 功能完整：选择、展示、删除一体化

  • 性能优化：高效的DOM操作

  • 可扩展：易于添加新功能

通过合理的状态管理和事件处理，组件保持了良好的内聚性，同时通过清晰的接口与外部系统通信。开发者可以根据具体需求进一步扩展功能，如增加分组标签、颜色自定义、拖拽排序等高级特性。

这种实现模式不仅适用于标签选择场景，其设计思路也可以应用到其他类似的交互组件开发中，是前端开发中的一个实用范例。

相关文章：

构建高效多标签选择组件：从设计到实现

在现代Web应用中&#xff0c;多标签选择功能已成为常见需求&#xff0c;特别是在内容分类、文章标签、用户兴趣选择等场景。本文将深入解析一个完整的多标签选择实现方案&#xff0c;涵盖交互设计、核心功能和优化技巧。 组件功能概述 这个多标签选择组件提供以下核心功能&am…...

编程日记 2025/8/25 20:24:09

4.1论文阅读

一&#xff1a;PhDnet&#xff1a;一种用于遥感图像的新型物理感知去雾网络&#xff08;A novel physic-aware dehazing network for remote sensing images&#xff09; 论文链接 只是粗略读了一下&#xff0c;关于遥感图像去雾&#xff0c;圆形U--net&#xff0c;加入了物理…...

编程日记 2025/8/25 20:21:31

【渗透测试】Vulnhub靶机-HA: Armour-详细通关教程

下载地址&#xff1a;https://www.vulnhub.com/entry/ha-armour,370/ 目录 前言 信息收集 tftp获取&#xff08;spiderman&#xff09; 查看.htpasswd&#xff08;ant-man&#xff09; ssh欢迎信息提示&#xff08;hulkbuster&#xff09; 反弹shell 提权&#xff08;i…...

编程日记 2025/8/21 18:08:26

Flask使用MySQL数据库通过Flask-SQLAlchemy 迁移数据库，实际更新文件，但是提示没有检测到数据更新。

本地写了一个model的用户类&#xff0c;数据库连接信息正确&#xff0c;执行下面2条命令进行数据库迁移。 flask db migrate 生成迁移文件 flask db upgrade 执行迁移文件的升级 发现执行完后&#xff1a;提示没有检测到数据的更新 PS C:\Users\mu> flask db migrate IN…...

编程日记 2025/8/21 18:20:29

【leetcode100】前K个高频元素

1、题目描述 给你一个整数数组 nums 和一个整数 k &#xff0c;请你返回其中出现频率前 k 高的元素。你可以按 任意顺序 返回答案。 示例 1: 输入: nums [1,1,1,2,2,3], k 2 输出: [1,2]示例 2: 输入: nums [1], k 1 输出: [1] 2、初始思路 2.1 思路 全排列&#xf…...

编程日记 2025/8/21 22:16:23

内网渗透-MySQL提权

MySQL提权 mysql的权限提升通常有两种&#xff1a; UDF提权&#xff08;常用&#xff09; 写文件提权启动项提权mof提权一、UDF提权 UDF 全称为user defined function&#xff0c;用户自定义函数 用户可以添加自定义的新函数到Mysql中&#xff0c;以达到功能的扩充&#xf…...

编程日记 2025/8/22 10:38:34

Hibernate核心方法总结

Session中的核心方法梳理 1、save方法 这个方法表示将一个对象保存到数据库中&#xff0c;可以将一个不含OID的new出来的临时对象转换为一个处于Session缓存中具有OID的持久化对象。 需要注意的是&#xff1a;在save方法前设置OID是无效的但是也不会报错&#xff0c;在save方…...

编程日记 2025/8/24 2:05:13

DevOps 与持续集成（CI/CD）

1. DevOps 概述 DevOps（Development + Operations）是一种软件开发方法，强调开发（Dev）与运维（Ops）协作，通过自动化工具提高软件交付效率。其目标是： ✅ 提高部署速度 —— 频繁发布新版本 ✅ 减少人为错误 —— 通过自动化降低运维风险 ✅ 增强可观测性 —— 监控和日…...

编程日记 2025/8/19 4:15:57

下一代AI App架构：前端生成，后端消失

过去十年&#xff0c;Web 和 App 的开发范式基本稳定&#xff1a;前端负责交互体验&#xff0c;后端负责业务逻辑和数据管理。即使是“无服务架构”也只是将后端“拆散”而非“消失”。 但随着 AI 原生应用的兴起&#xff0c;特别是 大模型本地化、小模型部署、WebAssembly、L…...

编程日记 2025/8/25 20:21:32

告别过去，奔向未来

人生就是一个不断雕刻自己的过程&#xff01;一路走来&#xff0c;我们经历过酸甜苦辣咸&#xff0c;迷茫过&#xff0c;跌倒过&#xff0c;懈怠过……但是&#xff0c;我想说这又何妨&#xff01;一个成功人士的经历必定是跌跌宕宕&#xff0c;起起伏伏的。关键是我们要做到&a…...

编程日记 2025/8/25 20:19:42

AF3 Recycling机制

在 AlphaFold3中，输入数据的特征加工中生成了recycling 维度的数据，主要通过ensembled_transform_fns函数抽样得到不同的扰动的MSA、template特征等，类似于数据增强的作用。在数据集的加载和模型的训练中利用了这一维度的数据，增强了模型的稳定性和鲁棒性，避免单一预测结果…...

编程日记 2025/8/25 20:21:33

notepad++8.6.4安装及细节

notepad8.6.4下载安装&#xff08;附安装包&#xff09; 一、安装包下载1.1方法一&#xff1a;官网下载&#xff08;点击跳转&#xff09;1.2方法二&#xff1a;网盘链接分享8.6.4版本 二、安装过程细节2.1这里的组件建议全部勾选。点击“下一步”。2.2 勾选①&#xff1a;可以…...

编程日记 2025/8/25 1:03:48

谁该处理我的请假？——责任链模式

谁该处理我的请假&#xff1f;——责任链模式 一、生活中的责任链&#xff1a;请假审批流程二、责任链模式的核心特点三、代码实现&#xff1a;请假审批责任链四、工作中的实际应用场景五、框架中的经典应用六、模式本质理解 一、生活中的责任链&#xff1a;请假审批流程 想象…...

编程日记 2025/8/24 18:40:50

【NLP应用场景全解】自然语言处理如何改变世界？

自然语言处理作为人工智能的重要分支&#xff0c;正在加速改变各行各业。根据Statista预测&#xff0c;到2025年&#xff0c;全球NLP市场规模将达到438亿美元。本文将系统梳理NLP的主要应用场景&#xff0c;结合最新技术趋势&#xff0c;帮助你了解NLP技术的落地现状与未来发展…...

编程日记 2025/8/24 8:42:19

Hive 中书写SQL注意的地方

1.1 关于 DDL &#xff08;1&#xff09;创建带有主键约束的 Hive 表时报错。 Hive 目前还没有严格支持“主键约束”&#xff0c;创建带有主键约束的 HIVE 表时报了如下错误&#xff1a; SemanticException [Error 10326]: Invalid Constraint: syntax ENABLE/ENFORCED featu…...

编程日记 2025/8/17 22:58:10

Ubuntu 下 无界面环境 多进程/多线程 使用DrissionPage

使用wget “https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb” -O chrome.deb 安装chrome # !/usr/bin/python3 # -*- coding:utf-8 -*- """ author: JHC000abcgmail.com file: dp.py time: 2025/2/20 20:22 desc:wget "htt…...

编程日记 2025/8/22 8:16:53

Opencv计算机视觉编程攻略-第十节 估算图像之间的投影关系

目录 1. 计算图像对的基础矩阵 2. 用RANSAC 算法匹配图像 3. 计算两幅图像之间的单应矩阵 4. 检测图像中的平面目标 图像通常是由数码相机拍摄的&#xff0c;它通过透镜投射光线成像&#xff0c;是三维场景在二维平面上的投影&#xff0c;这表明场景和它的图像之间以及同一…...

编程日记 2025/8/24 1:31:12

RocketMQ 01

今天是2025/04/06 21:31 day 18 总路线请移步主页Java大纲相关文章 今天进行RocketMQ 1,2 个模块的归纳 首先是RocketMQ 的相关内容概括的思维导图 1. 核心组件 1.1 NameServer 核心功能 服务发现&#xff1a;作为轻量级注册中心&#xff0c;管理所有 Broker 的地址和路由信…...

编程日记 2025/8/21 2:42:36

牛客周赛———字符串

题目如下 思路&#xff08;贪心&#xff09; >和<的位置是固定不变的&#xff0c;所以先处理这两个符号&#xff0c;然后再遍历一遍检查‘Z’&#xff0c;如果不符合条件将Z的位置改变正负性使其满足条件&#xff0c;然后遍历的时候记数答案就行了&#xff0c;注意s的首…...

编程日记 2025/8/17 23:33:23

在Hive中，将数据从一个表查询并插入到另一个表

1. 确认目标表结构 确保目标表已存在且结构与查询结果匹配。若不存在&#xff0c;需先创建&#xff1a; CREATE TABLE target_table ( id INT, name STRING ) PARTITIONED BY (dt STRING) STORED AS ORC; 2. 选择插入方式 覆盖插入&#xff08;替换现有数据&#xff0…...

编程日记 2025/8/19 14:36:37

优雅实现级联选择器：CascadeSelect 类设计与实现

在现代Web开发中&#xff0c;级联选择器是一种常见的UI组件&#xff0c;它能够有效地组织和展示层级数据。本文将深入解析一个功能完善的级联选择器实现——CascadeSelect类&#xff0c;展示如何用面向对象的方式构建可复用的UI组件。 组件概述 CascadeSelect是一个二级下拉框…...

编程日记 2025/8/25 20:24:07

26考研 | 王道 | 数据结构 | 第五章 树

第五章 树 5.1. 树的概念 5.1.1. 树的基本定义 树:n(n>0)个节点的有限集合&#xff0c;是一种逻辑结构&#xff0c;当n0时为空树&#xff0c;且非空树满足: 有且仅有一个特定的称为根的节点当n>1时&#xff0c;其余结点可分为m (m >0) 个互不相交的有限集合&#x…...

编程日记 2025/8/25 8:29:45

Spring 怎么解决循环依赖问题？

Spring 循环依赖&#xff08;circular dependency&#xff09; 指的是多个 Bean 之间的相互依赖&#xff0c;比如&#xff1a; A 依赖 B&#xff0c;B 又依赖 A&#xff1b;或者 A → B → C → A 这种嵌套循环依赖。 这是一个常见又棘手的问题&#xff0c;但 Spring 是可以解…...

编程日记 2025/8/22 22:05:34

微软推出首款量子计算芯片Majorana 1

全球首款拓扑架构量子芯片问世&#xff0c;2025年2月20日&#xff0c;经过近20年研究&#xff0c;微软推出了首款量子计算芯片Majorana 1&#xff0c;其宣传视频如本文末尾所示。 微软表示&#xff0c;开发Majorana 1需要创造一种全新的物质状态&#xff0c;即所谓的“拓扑体”…...

编程日记 2025/8/25 20:21:30

OSI模型中协议数据单元（PDU）

OSI模型中协议数据单元&#xff08;PDU&#xff09; 协议数据单元&#xff08;Protocol Data Unit, PDU&#xff09;是网络通信中每一层协议处理的数据单位&#xff0c;其内容和格式由特定层的协议定义。PDU在不同OSI层次中有不同的名称和结构&#xff0c;体现了分层模型的核心…...

编程日记 2025/8/24 8:50:29

代码训练营day24 回溯算法

回溯算法part03 93.复原IP地址 题目链接/文章讲解&#xff1a;代码随想录 视频讲解&#xff1a;回溯算法如何分割字符串并判断是合法IP&#xff1f;| LeetCode&#xff1a;93.复原IP地址_哔哩哔哩_bilibili 本题关键在于终止条件 插入3个’.’时判断 ip地址最后一段是否…...

编程日记 2025/8/22 22:49:55

DP Alt Mode 与 DP协议的关系

1. 什么是 “Alt Mode”&#xff08;替代模式&#xff09;&#xff1f; Alt Mode&#xff08;Alternative Mode&#xff09; 是 USB Type-C 接口 的扩展协议机制&#xff0c;允许通过 物理接口复用&#xff08;Pin Reuse&#xff09; 将USB-C接口动态切换为其他协议&#xff0…...

编程日记 2025/8/25 18:00:17

【欧拉筛】哥德巴赫猜想题解

哥德巴赫猜想题解 题目传送门 1292. 哥德巴赫猜想 一、题目描述 哥德巴赫猜想指出&#xff1a;任意一个大于4的偶数都可以拆成两个奇素数之和。给定多个偶数(6 ≤ n < 10^6)&#xff0c;验证它们是否符合这个猜想。对于每个偶数&#xff0c;输出其素数分解中两数差最大的…...

编程日记 2025/8/21 19:11:36

A*算法详解及Python实现

一、什么是A*算法&#xff1f; A*&#xff08;读作"A-star"&#xff09;算法是一种广泛使用的路径查找和图形遍历算法&#xff0c;它结合了Dijkstra算法的完备性和贪婪最佳优先搜索的高效性。A*算法通过使用启发式函数来估算从当前节点到目标节点的成本&#xff0c;…...

编程日记 2025/8/23 16:57:11

【C++】第九节—string类(中)——详解+代码示例

hello&#xff01; 云边有个稻草人-CSDN博客 C_云边有个稻草人的博客-CSDN博客 菜鸡进化中。。。 目录 【补充】 二、string类里面的常用接口 1.resize 2.insert 3.assign 4.erase 5.replacefind 6.c_str 7.rfindsubstr 8.find_first_of、find_last_of、find_first…...

编程日记 2025/8/21 21:40:57

vite.config.js常用配置

vite 是一个基于 Vue3 单文件组件的非打包开发服务器&#xff0c;它做到了本地快速开发启动&#xff1a; 快速的冷启动&#xff0c;不需要等待打包操作&#xff1b; 即时的热模块更新&#xff0c;替换性能和模块数量的解耦让更新飞起&#xff1b; 真正的按需编译&#xff0c;不…...

编程日记 2025/8/21 18:39:45

【C++11（下）】—— 我与C++的不解之缘（三十二）

前言 随着 C11 的引入&#xff0c;现代 C 语言在语法层面上变得更加灵活、简洁。其中最受欢迎的新特性之一就是 lambda 表达式&#xff08;Lambda Expression&#xff09;&#xff0c;它让我们可以在函数内部直接定义匿名函数。配合 std::function 包装器 使用&#xff0c;可以…...

编程日记 2025/8/24 12:39:28

李臻20242817_安全文件传输系统项目报告_第6周

安全文件传输系统项目报告&#xff08;第 1 周&#xff09; 1. 代码链接 Gitee 仓库地址&#xff1a;https://gitee.com/li-zhen1215/homework/tree/master/Secure-file 代码结构说明&#xff1a; project-root/├── src/ # 源代码目录│ ├── main.c # 主程序入口│ ├…...

编程日记 2025/8/23 8:12:10

使用SymPy求解矩阵微分方程

引言 在数学、物理、工程等领域，微分方程常常被用来描述系统的变化和动态过程。对于多变量系统或者多方程系统，矩阵微分方程是非常常见的，它可以用来描述如电路、控制系统、振动系统等复杂的动态行为。今天，我们将通过Python 中的 SymPy 库来求解矩阵微分方程，帮助大家轻…...

编程日记 2025/8/17 23:34:41

Flutter之用户输入网络数据缓存

目录&#xff1a; 1、处理用户输入1.1、按钮1.2、文本1.3、富文本1.4、TextField1.5、Form 2、复选框、Switch 和 Radio2.1、复选框2.2、Switch2.3、Radio 3、选择日期或时间4、滑动5、网络和数据6、本地缓存6.1、在本地内存中缓存数据 7、web端和Flutter样式控制对比7.1、文本…...

编程日记 2025/8/22 8:01:39

华为IP（4）

VRRP&#xff08;虚拟路由冗余协议&#xff09; 前言&#xff1a; 局域网中的用户终端通常采用配置一个默认网关的形式访问外部网络&#xff0c;如果默认网关设备发生故障&#xff0c;那么所有用户终端访问外部网络的流量将会中断。可以通过部署多个网关的方式来解决单点故障…...

编程日记 2025/8/22 23:57:25

蓝桥杯刷题周计划（第四周)

目录 前言题目一题目代码题解分析 题目二题目代码题解分析 题目三题目代码题解分析 题目四题目代码题解分析 题目五题目代码题解分析 题目六题目代码题解分析 题目七题目代码题解分析 题目八题目代码题解分析 题目九题目代码题解分析 题目十题目代码题解分析题目代码题解分析 题…...

编程日记 2025/8/25 17:18:40

华为网路设备学习-17

目录 一、加密算法 二、验证算法 三、IPsec协议 1.IKE协议&#xff08;密钥交换协议&#xff09; ①‌ISAKMP&#xff08;Internet Security Association and Key Management Protocol&#xff09;互联网安全关联和密钥管理协议 ②安全关联&#xff08;SA&#xff09; ③…...

编程日记 2025/8/24 15:36:21

【动态规划】深入动态规划 非连续子序列问题

文章目录 前言例题一、最长递增子序列二、摆动序列三、最长递增子序列的个数四、最长数对链五、最长定差子序列六、最长的斐波那契子序列的长度七、最长等差数列八、等差数列划分II - 子序列 结语 前言 什么是动态规划中的非连续子序列问题&#xff1f; 动态规划中的非连续子序…...

编程日记 2025/8/20 23:53:03

灵魂拷问，指针为什么是C语言的灵魂？

目录 | 引 言 | 内存操作 | 构造复杂的数据结构 | 底层硬件交互 | 指针的陷阱 | 文 末 | 引 言 指针是C语言的灵魂&#xff01; 这句话是不是很耳熟&#xff1f;但为什么这么说&#xff0c;你知道吗&#xff1f; 本篇小文就从内存、数据结构、底层硬件交互这三个维度来…...

编程日记 2025/8/24 15:57:34

Node.js自定义中间件

目录 Node.js 自定义中间件详细介绍 1. 目录结构 2. 什么是自定义中间件&#xff1f; 3. 代码实现 1. 自定义日志中间件&#xff08;记录请求信息&#xff09; 2. 自定义身份验证中间件&#xff08;校验用户权限&#xff09; 3. 自定义请求时间中间件&#xff08;记录请…...

编程日记 2025/8/20 9:16:57

Qt 音乐播放器项目

具体代码见&#xff1a;https://gitee.com/Suinnnnnn/MusicPlayer 文章目录 0. 预备1. 界面1.1 各部位长度1.2 ui文件1.3 窗口前置设置1.4 设置QSS 2. 自定义控件2.1 按钮2.2 推荐页面2.3 CommonPage2.4 滑杆 3. 音乐管理4. 歌词界面4.1 ui文件4.2 LrcPage.h文件 5. 音乐播放控…...

编程日记 2025/8/23 4:08:40

初识数据结构——Java集合框架解析：List与ArrayList的完美结合

&#x1f4da; Java集合框架解析&#xff1a;List与ArrayList的完美结合 &#x1f31f; 前言&#xff1a;为什么我们需要List和ArrayList&#xff1f; 在日常开发中&#xff0c;我们经常需要处理一组数据。想象一下&#xff0c;如果你要管理一个班级的学生名单&#xff0c;或…...

编程日记 2025/8/22 11:10:29

LightRAG实战：轻松构建知识图谱，破解传统RAG多跳推理难题

作者&#xff1a;后端小肥肠 &#x1f34a; 有疑问可私信或评论区联系我。 &#x1f951; 创作不易未经允许严禁转载。 姊妹篇&#xff1a; 2025防失业预警&#xff1a;不会用DeepSeek-RAG建知识库的人正在被淘汰_deepseek-embedding-CSDN博客 从PDF到精准答案&#xff1a;Coze…...

编程日记 2025/8/20 12:35:43

Hyperlane框架全面详解与应用指南 [特殊字符][特殊字符][特殊字符]

Hyperlane框架全面详解与应用指南 &#x1f680;&#x1f680;&#x1f680; &#x1f4da; 前言 欢迎来到Hyperlane框架的全面详解与应用指南&#xff01;&#x1f389;&#x1f389;&#x1f389; 本文档旨在为开发者提供一个全面、详尽的Hyperlane框架使用指南&#xff0c…...

编程日记 2025/8/22 19:09:00

使用LVS的 NAT 模式实现 3 台RS的轮询访问

题目 使用LVS的 NAT 模式实现 3 台RS的轮询访问。IP地址和主机自己规划。 -i— turn&#xff0c;-g——DR模式&#xff0c;-m——NAT模式 节点规划 仅主机网段&#xff1a;192.168.216.0/24 NAT网段&#xff1a;192.168.88.0/24 主机角色系统网络ipclientclientredhat9.5仅…...

编程日记 2025/8/21 16:43:05

BGP路由协议之属性4

MED 多出口鉴别器 可选非过渡属性 EBGP 的邻居 Cost 开销值&#xff0c;控制如何进入 AS。越小越优。继承 IGP 的开销值&#xff0c;默认 0 MED(Multi-Exit Discriminator&#xff0c;多出口鉴别器)是可选非过属性&#xff0c;是一种度量值用于向外部对等体指出进入本 AS 的首…...

编程日记 2025/8/23 10:22:58

数据库的操作

1.创建数据库 CREATE DATABASE [IF NOT EXISTS] db_name [create_specification [,create_specification] ...]create_specification: [DEFAULT] CHARACTER SET charset_name [DEFAULT] COLLATE collation_name 大写的表示关键字。[]是可选项。CHARACTER SET&#xff1a;指定…...

编程日记 2025/8/23 21:24:32

【愚公系列】《高效使用DeepSeek》055-可靠性评估与提升

🌟【技术大咖愚公搬代码：全栈专家的成长之路，你关注的宝藏博主在这里！】🌟 📣开发者圈持续输出高质量干货的"愚公精神"践行者——全网百万开发者都在追更的顶级技术博主！ 👉 江湖人称"愚公搬代码"，用七年如一日的精神深耕技术领域，以"…...

编程日记 2025/8/24 10:01:22

记录clickhouse记录一次性能优化，从60s到1s

文章目录 问题表结构类似如下分析第一步调整第一步观察多磁盘读继续观察sql 问题 一个查询接口&#xff0c;涉及多个clickhouse 查询&#xff0c;查询用时一下变成要60s 表结构类似如下 CREATE TABLE demo.test_local (id UUID,date DateTime,type String ) ENGINE Replic…...

编程日记 2025/8/21 22:44:46