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

Vue3 后台管理系统模板

news 来源：原创 2025/5/17 6:41:04

Vue3 后台管理系统模板

gie仓库地址
一个基于 Vue3 + TypeScript + Element Plus 的后台管理系统模板，集成了动态路由和权限管理功能。

在这里插入图片描述

技术栈

  • Vue 3.2
  • TypeScript 4.5
  • Vue Router 4
  • Vuex 4
  • Element Plus 2.9
  • Axios
  • Less

功能特性

  • 🚀 基于 Vue3 最新技术栈开发
  • 📦 使用 TypeScript 进行开发，提供更好的类型检查和开发体验
  • 🔐 完整的权限管理解决方案，支持动态路由和按钮级权限控制
  • 🎨 使用 Element Plus 组件库，提供美观的 UI 界面
  • 📱 响应式设计，支持多种设备访问
  • 🔧 支持 PWA，可离线访问
  • 📝 集成 ESLint + Prettier，统一代码风格

项目结构

src/
├── assets/         # 静态资源
├── components/     # 公共组件
├── hooks/          # Vue3 组合式 API 钩子
├── network/        # 网络请求相关
├── plugins/        # 插件
├── router/         # 路由配置
├── store/          # Vuex 状态管理
├── utils/          # 工具函数
└── views/          # 页面组件

安装和使用

环境要求

  • Node.js >= 14.0.0
  • npm >= 6.0.0

安装依赖

npm install

开发环境运行

npm run serve

生产环境构建

npm run build

代码检查

npm run lint

权限管理

本项目实现了完整的权限管理功能，包括动态路由和按钮级权限控制。以下是详细的实现说明：

1. 权限管理架构

权限管理主要包含以下几个部分：

  • 路由权限控制
  • 菜单权限控制
  • 按钮级权限控制
  • 数据权限控制

2. 实现细节

2.1 路由权限控制

  1. 路由守卫实现

    • 在 router/index.ts 中实现全局路由守卫
    • 检查用户是否登录（通过 token）
    • 动态添加路由配置

  2. 动态路由生成

    • 用户登录后获取权限菜单数据
    • 通过 addDynamicRoutes 工具函数动态生成路由
    • 支持路由懒加载，提高性能

  3. 路由配置示例

// 路由守卫实现
router.beforeEach((to, from, next) => {const token = localStorage.getItem('token');if (!token && to.meta.check) {next({ name: 'login' });return;}// 动态添加路由if (token && !layoutRoute.children.length) {const menus = JSON.parse(localStorage.getItem('menus') || '[]');addDynamicRoutes(router, menus);next({ ...to, replace: true });return;}next();
});
2.2 菜单权限控制

  1. 菜单数据结构

    • 支持多级菜单
    • 包含路径、名称、组件、元数据等信息
    • 支持菜单图标、权限标识等扩展属性

  2. 菜单渲染

    • 根据用户权限动态生成菜单
    • 支持菜单缓存，提高性能
    • 支持菜单排序和分组
2.3 按钮级权限控制

  1. 权限指令实现

    • 通过自定义指令 v-permission 控制按钮显示
    • 支持权限表达式，如：v-permission="['add', 'edit']"
    • 支持权限组合判断

  2. 使用示例

<template><el-button v-permission="['add']">添加</el-button><el-button v-permission="['edit']">编辑</el-button><el-button v-permission="['delete']">删除</el-button>
</template>
2.4 数据权限控制

  1. 数据过滤

    • 根据用户角色过滤数据
    • 支持数据范围控制
    • 支持字段级权限控制

  2. 实现方式

    • 在 API 请求中添加权限参数
    • 后端根据权限参数过滤数据
    • 前端处理权限数据展示

3. 权限管理流程

  1. 登录流程

    • 用户输入账号密码登录
    • 获取用户 token 和权限信息
    • 存储权限信息到本地存储

  2. 权限验证流程

    • 路由跳转时验证权限
    • 动态生成路由和菜单
    • 控制按钮和数据的访问权限

  3. 权限更新流程

    • 支持动态更新权限
    • 支持权限缓存清理
    • 支持权限实时生效

4. 安全考虑

  1. 前端安全

    • 敏感信息加密存储
    • 路由权限双重验证
    • XSS 防护

  2. 后端安全

    • 接口权限验证
    • 数据权限过滤
    • 防 SQL 注入

接口封装

本项目采用统一的接口封装方案，提供了完整的请求拦截、响应拦截和错误处理机制。以下是详细的实现说明：

1. 接口封装架构

接口封装主要包含以下几个部分：

  • 请求实例配置
  • 请求拦截器
  • 响应拦截器
  • 接口模块化
  • 统一错误处理

2. 实现细节

2.1 请求实例配置
const service = axios.create({baseURL: "/api/pc",timeout: 40000,headers: {"Access-Control-Allow-Origin": "*","Connection": "Keep-Alive","Content-Type": "application/json; charset = utf-8"}
})
2.2 请求拦截器
service.interceptors.request.use(config => {const token = localStorage.getItem("token");if (token) {config.headers["access-token"] = token}return config;}
)
2.3 响应拦截器
service.interceptors.response.use((res) => {const code = res.data.codeif (code == 100) {router.push({ name: "login" });} else if (code == 1) {ElMessage({message: res.data.msg,type: 'warning'});}return res}, (error) => {return Promise.reject(error);}
)
2.4 接口模块化
  1. 目录结构
src/network/
├── index.ts        # 请求配置和拦截器
└── apis/           # 接口模块├── home.ts     # 首页相关接口├── work.ts     # 工作相关接口└── user.ts     # 用户相关接口
  1. 接口定义示例
// apis/home.ts
export default {// 获取首页数据getHomeData: (params: any) => ({url: '/home/data',method: 'get',params}),// 更新首页数据updateHomeData: (data: any) => ({url: '/home/update',method: 'post',data})
}
  1. 接口调用示例
import getData from '@/network';// 获取首页数据
const getHomeData = async () => {try {const res = await getData('home/getHomeData', { page: 1 });return res.data;} catch (error) {console.error('获取首页数据失败:', error);}
}

3. 接口封装特点

  1. 统一配置

    • 统一的 baseURL 配置
    • 统一的超时时间设置
    • 统一的请求头配置

  2. 自动处理

    • 自动添加 token
    • 自动处理登录过期
    • 自动处理错误提示

  3. 模块化管理

    • 按功能模块划分接口
    • 支持接口自动导入
    • 支持接口命名空间

  4. 类型支持

    • 完整的 TypeScript 类型支持
    • 接口参数类型检查
    • 响应数据类型定义

4. 错误处理机制

  1. 请求错误处理

    • 网络错误处理
    • 超时错误处理
    • 请求取消处理

  2. 响应错误处理

    • 状态码错误处理
    • 业务错误处理
    • 登录过期处理

  3. 错误提示

    • 统一的错误提示组件
    • 可配置的错误提示方式
    • 支持自定义错误处理

5. 使用建议

  1. 接口定义

    • 使用 TypeScript 定义接口类型
    • 添加详细的接口注释
    • 遵循统一的命名规范

  2. 接口调用

    • 使用 async/await 处理异步
    • 添加适当的错误处理
    • 注意请求参数的合法性

  3. 性能优化

    • 合理使用请求缓存
    • 避免重复请求
    • 控制并发请求数量

贡献指南

欢迎提交 Issue 和 Pull Request 来帮助改进项目。

权限说明

    <!-- 路由格式 -->使用方式,登录后后端返回数据格式,根据这个格式,把所有路径路由配置放在这里,读取的时候让后台判断,返回那些路径,与后端沟通好.<!-- 把路由配置放在这里 -->parentId: id;index: index;title:一级路由名称icon:图标 我用的是iconfont 的图标 根据自己情况替换就行了;type: group;children: [ //子级路由index:index;title:二级路由名称path:path;name:name;component:文件读取路径 读取pages 文件 路径// 看不明白的就把这里的路径和pages 下的路径对比一下就明白了menuType:menuType;meta:   路由原信息] ;"nav": [{"parentId": "1","index": "1","title": "首页","icon": "icon-shouye","type": "group","children": [{"index": "1-1","title": "首页","name": "home","path": "/home","component": "shouYe/index","menuType": 0,"meta": {"selectIndex": "1-1","check": true}}]},{"parentId": "2","index": "2","title": "设备管理","icon": "icon-shebei","type": "group","children": [{"index": "2-1","title": "设备列表","name": "shebei","path": "/shebei","component": "shebei/shebei","menuType": 0,"meta": {"selectIndex": "2-1","check": true}}]},{"parentId": "3","index": "3","title": "模块管理","icon": "icon-mokuai","type": "group","children": [{"index": "3-1","title": "模块列表","name": "mokuai","path": "/mokuai","component": "mokuai/Mokuai","menuType": 0,"meta": {"selectIndex": "3-1","check": true}}]},{"parentId": "4","index": "4","title": "标靶检测","icon": "icon-mubiaobachang1","type": "group","children": [{"index": "4-1","title": "报警列表","name": "jingIndex","path": "/jingIndex","component": "biaoba/index","menuType": 0,"meta": {"selectIndex": "4-1","check": true}},{"index": "4-2","title": "标靶检测","name": "biaoba","path": "/biaoba","component": "biaoba/biaoba","menuType": 0,"meta": {"selectIndex": "4-2","check": true}},{"index": "4-3","title": "标靶报警","name": "baojing","path": "/baojing","component": "biaoba/baojing","menuType": 0,"meta": {"selectIndex": "4-3","check": true}},{"index": "4-4","title": "报警等级","name": "dengji","path": "/dengji","component": "biaoba/dengji","menuType": 0,"meta": {"selectIndex": "4-4","check": true}}]}]

许可证

MIT

相关文章：

Vue3 后台管理系统模板

Vue3 后台管理系统模板 gie仓库地址 一个基于 Vue3 TypeScript Element Plus 的后台管理系统模板&#xff0c;集成了动态路由和权限管理功能。 技术栈 Vue 3.2TypeScript 4.5Vue Router 4Vuex 4Element Plus 2.9AxiosLess 功能特性 &#x1f680; 基于 Vue3 最新技术栈开…...

编程日记 2025/5/17 6:41:04

RPG4.设置角色输入

这一篇是进行玩家移动和视角移动的介绍。 1.在玩家内进行移动覆写 virtual void SetupPlayerInputComponent(UInputComponent* PlayerInputComponent) override; 2.创建增强输入资产的变量创建 UPROPERTY(EditDefaultsOnly, BlueprintReadOnly, Category "CharacterD…...

编程日记 2025/5/1 6:37:20

生产模块-备货生产

特点 从狭义的角度来看&#xff0c;备货生产场景主要出现在产品定制化需求低&#xff0c;产品工艺流程稳定可以大批生产&#xff0c;市场行情可预测的企业。为了实现订单快速交付&#xff0c;缩短交货周期&#xff0c;企业往往会结合公司历史订单数据和当前市场情况安排提前生产…...

编程日记 2025/5/1 6:36:18

GRE隧道

1.在锐捷网络设备中&#xff0c;tunnel mode gre ip 和 tunnel mode gre multipoint 是两种不同的 GRE&#xff08;Generic Routing Encapsulation&#xff09;隧道模式&#xff0c;主要区别在于连接拓扑和使用场景&#xff1a; 1. tunnel mode gre ip&#xff08;点到点 GRE …...

编程日记 2025/5/1 6:35:17

ASP.NET MVC​ 入门与提高指南六

31. 事件驱动架构与 MVC 集成 31.1 事件驱动架构概念 事件驱动架构&#xff08;Event - Driven Architecture&#xff0c;EDA&#xff09;是一种软件设计模式&#xff0c;系统中的组件通过发布和订阅事件来进行通信。在这种架构中&#xff0c;当某个事件发生时&#xff0c;相…...

编程日记 2025/5/1 6:34:14

【MongoDB篇】MongoDB的文档操作！

目录 引言第一节&#xff1a;C - Create - 创建文档 (Insert) &#x1f476;➕第二节&#xff1a;R - Read - 读取文档 (Query) &#x1f4da;&#x1f440;第三节&#xff1a;U - Update - 更新文档 (Update) &#x1f504;✍️第四节&#xff1a;D - Delete - 删除文档 (Dele…...

编程日记 2025/5/1 6:34:13

详解具身智能机器人开源数据集：RoboMIND

一、RoboMIND基础信息 RoboMIND 发布时间&#xff1a;2024年12月 创建方&#xff1a;国家地方共建具身智能机器人创新中心与北京大学计算机学院联合创建。 所使用的机器人&#xff1a;单臂机器人&#xff08;Franka Emika Panda 、UR5e &#xff09;、双臂机器人&#xff08;…...

编程日记 2025/5/1 6:33:12

施磊老师rpc(一)

文章目录 mprpc项目**项目概述**&#xff1a;深入学习到什么**前置学习建议**&#xff1a;核心内容其他技术与工具**项目特点与要求**&#xff1a;**环境准备**&#xff1a; 技术栈集群和分布式理论单机聊天服务器案例分析集群聊天服务器分析分布式系统介绍多个模块的局限引入分…...

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

视觉问答大模型速递：Skywork-R1V2-38B

Skywork-R1V2-38B速读 一、模型概述 Skywork-R1V2-38B是一种最先进的开源多模态推理模型&#xff0c;在多项基准测试中表现卓越。它在MMMU测试中以73.6%的得分位居所有开源模型之首&#xff0c;在OlympiadBench测试中以62.6%的得分大幅领先于其他开源模型。此外&#xff0c;R…...

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

Spring Boot 中集成 Kafka 并实现延迟消息队列

在 Spring Boot 中集成 Kafka 并实现延迟消息队列，需要结合 Kafka 的基础功能与自定义逻辑来处理延迟投递。以下是完整的实现步骤和示例代码，涵盖配置、生产者、消费者、延迟队列设计和消息重试机制。 一、环境准备与依赖配置 添加依赖 在 pom.xml 中添加 Spring Kafka 依赖：…...

编程日记 2025/5/1 6:30:02

【算法学习】哈希表篇：哈希表的使用场景和使用方法

算法学习&#xff1a; https://blog.csdn.net/2301_80220607/category_12922080.html?spm1001.2014.3001.5482 前言&#xff1a; 在之前学习数据结构时我们就学习了哈希表的使用方法&#xff0c;这里我们主要是针对哈希表的做题方法进行讲解&#xff0c;都是leetcode上的经典…...

编程日记 2025/5/1 6:30:02

（51单片机）LCD显示红外遥控相关数据（Delay延时函数）（LCD1602教程）（Int0和Timer0外部中断教程）（IR红外遥控模块教程）

前言&#xff1a; 本次Timer0模块改装了一下&#xff0c;注意&#xff01;&#xff01;&#xff01; 演示视频&#xff1a; 红外遥控 源代码&#xff1a; 如上图将9个文放在Keli5 中即可&#xff0c;然后烧录在单片机中就行了 烧录软件用的是STC-ISP&#xff0c;不知道怎么安…...

编程日记 2025/5/1 6:30:01

农产品园区展示系统——仙盟创梦IDE开发

<!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>农业大数据平台</title><style>* {margi…...

编程日记 2025/5/9 23:59:16

Copilot：您的AI伴侣-微软50周年系列更新

回顾微软五十年来持续创新带来的深远影响&#xff0c;比尔盖茨当年"让每张办公桌、每个家庭都拥有电脑"的宏伟愿景至今仍激励着我们。微软AI团队正秉承同样的精神&#xff0c;打造属于每个人的AI伙伴——Copilot。 这意味着什么&#xff1f;它是什么模样&#xff1f…...

编程日记 2025/5/1 6:27:57

【人工智能】深入探索Python中的自然语言理解：实现实体识别系统

《Python OpenCV从菜鸟到高手》带你进入图像处理与计算机视觉的大门！ 解锁Python编程的无限可能：《奇妙的Python》带你漫游代码世界 自然语言理解（NLU）是人工智能（AI）领域中的重要研究方向之一，其目标是让计算机理解和处理人类语言。在NLU的众多应用中，实体识别（Nam…...

编程日记 2025/5/1 6:26:55

​​Steam安装下载及新手注册

&#x1f4e2;博客主页&#xff1a;肩匣与橘 &#x1f4e2;欢迎点赞 &#x1f44d; 收藏 ⭐留言 &#x1f4dd; 如有错误敬请指正&#xff01; &#x1f4e2;本文由肩匣与橘编写&#xff0c;首发于CSDN&#x1f649; &#x1f4e2;生活依旧是美好而又温柔的&#xff0c;你也…...

编程日记 2025/5/1 6:26:55

Gradio全解20——Streaming：流式传输的多媒体应用（1）——流式传输音频：魔力8号球

Gradio全解20——Streaming&#xff1a;Streaming&#xff1a;流式传输的多媒体应用&#xff08;1&#xff09;——流式传输音频&#xff1a;魔力8号球 前言本篇摘要20. Streaming&#xff1a;流式传输的多媒体应用20.1 流式传输音频&#xff1a;魔力8号球20.1.1 工作原理20.1.…...

编程日记 2025/5/1 6:26:54

Netflix系统架构解析

Netflix系统架构解析 Netflix架构旨在高效可靠地同时为数百万用户提供内容。以下是其特性和组件的详细分析。 是否曾好奇Netflix如何让您目不转睛地享受无中断的流畅播放体验&#xff1f;幕后功臣正是Netflix架构&#xff0c;它负责提供吸引全球观众的无缝流媒体体验。Netflix的…...

编程日记 2025/5/1 6:26:53

宝塔面板运行docker的jenkins

1.在宝塔面板装docker&#xff0c;以及jenkins 2.ip:端口访问jenkins 3.获取密钥&#xff08;点击日志&#xff09; 4.配置容器内的jdk和maven环境&#xff08;直接把jdk和maven文件夹放到jenkins容器映射的data文件下&#xff09; 点击容器-->管理-->数据存储卷--.把相…...

编程日记 2025/5/1 6:26:53

【计算机视觉】目标检测：深度解析Detectron2：Meta开源目标检测与图像分割框架实战指南

深度解析Detectron2&#xff1a;Meta开源目标检测与图像分割框架实战指南 技术架构与设计哲学核心设计理念关键技术组件 环境配置与安装硬件建议配置详细安装步骤 实战流程详解1. 自定义数据集准备2. 模型配置与训练3. 模型评估与推理 核心功能扩展1. 自定义模型架构2. 混合精度…...

编程日记 2025/5/1 6:25:50

Notepad编辑器实现换行符替换

在不同的Note编辑器中&#xff0c;批量把换行替换为空的方法有所不同&#xff0c;以下是常见编辑器的操作方法&#xff1a; Notepad 打开文件后&#xff0c;按CtrlH打开“查找和替换”对话框&#xff0c;在“查找”字段中输入\r\n&#xff0c;在“替换为”字段中输入一个空格…...

编程日记 2025/5/5 4:53:07

【数据通信完全指南】从物理层到协议栈的深度解析

目录 1. 通信技术演进与核心挑战1.1 从电报到5G的技术变迁1.2 现代通信系统的三大瓶颈 2. 通信系统架构深度解构2.1 OSI七层模型运作原理2.2 TCP/IP协议栈实战解析 3. 物理层关键技术实现3.1 信号调制技术演进路线3.2 信道复用方案对比 4. 数据传输可靠性保障4.1 CRC校验算法数…...

编程日记 2025/5/4 17:01:42

SpringBoot多工程项目微服务install时如何不安装到本地仓库

在 Spring Boot 微服务项目中&#xff0c;比如各业务微服务模块由于不存在相互依赖度的问题&#xff0c;因此执行maven install时无需安装到本地仓库&#xff0c;但仍然需要参与构建&#xff08;如 mvn compile 或 mvn package&#xff09;。公共模块&#xff08;如​​辅助工具…...

编程日记 2025/5/1 6:25:48

强化学习_Paper_2017_Curiosity-driven Exploration by Self-supervised Prediction

paper Link: ICM: Curiosity-driven Exploration by Self-supervised Prediction GITHUB Link: 官方: noreward-rl 1- 主要贡献 对好奇心进行定义与建模 好奇心定义&#xff1a;next state的prediction error作为该state novelty 如果智能体真的“懂”一个state&#xff0c;那…...

编程日记 2025/5/1 6:25:47

iview内存泄漏

iview在升级到view-design之前&#xff0c;是存在严重的内存泄漏问题的&#xff0c;而如果你在项目中大量使用了iview组件&#xff0c;就可能面临大量的升级工作要做&#xff0c;因为样式很多是不兼容的。 我们今天就看一下iview的源码&#xff0c;看看到底问题在哪里&#xff…...

编程日记 2025/5/16 10:30:02

【Hive入门】Hive高级特性：事务表与ACID特性详解

目录 1 Hive事务概述 2 ACID特性详解 3 Hive事务表的配置与启用 3.1 启用Hive事务支持 3.2 创建事务表 4 Hive事务操作流程 5 并发控制与隔离级别 5.1 Hive的锁机制 5.2 隔离级别 6 Hive事务的限制与优化 6.1 主要限制 6.2 性能优化建议 7 事务表操作示例 7.1 基本…...

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

Modbus转PROFIBUS网关：电动机保护新突破！

Modbus转PROFIBUS网关&#xff1a;电动机保护新突破&#xff01; 在现代工业自动化领域&#xff0c;Modbus RTU和PROFIBUS DP是两种常见且重要的通讯协议。它们各自具有独特的优势和应用场景&#xff0c;但在实际工程中&#xff0c;我们常常需要将这两种不同协议的设备进行互联…...

编程日记 2025/5/16 17:46:17

大数据应用开发和项目实战-Seaborn

设计目标 seaborn 建立在 matplotlib 之上&#xff0c;专注于统计数据可视化&#xff0c;简化绘图过程&#xff0c;提供高级接口和美观的默认主题 Seaborn的安装&#xff1a; 1.pip install seaborn -i 2.conda install seaborn &#xff08;清华源&#xff1a;https://pypi.t…...

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

弹窗探索鸿蒙之旅：揭秘弹窗的本质与奥秘

嘿&#xff0c;小伙伴们&#xff01;&#x1f44b; 今天我们要一起探索那些在日常应用中无处不在的小精灵——弹窗&#xff01;&#x1f4ac; &#x1f914; ‌弹窗到底是什么&#xff1f;‌ 简单来说&#xff0c;弹窗就是应用程序中突然冒出来的交互元素&#xff0c;它们像…...

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

“技术创新+全球视野”良性驱动，首航新能的2025新征程正式起航

撰稿 | 行星 来源 | 贝多财经 近日&#xff0c;备受瞩目的“2025年光伏第一股”深圳市首航新能源股份有限公司&#xff08;301658.SZ&#xff0c;下称“首航新能”&#xff09;对外发布了上市后的首份年报&#xff0c;交出了一份量质齐升的业绩答卷&#xff0c;构筑更加强大的…...

编程日记 2025/5/15 1:48:00

黑群晖Moments视频无缩略图，安装第三方ffmpeg解决

黑群晖Moments视频无缩略图&#xff0c;安装第三方ffmpeg解决 1. 设置套件来源 黑群晖Moments视频无缩略图&#xff0c;安装第三方ffmpeg解决 基于这个文章&#xff0c;补充一下&#xff1a; 1. 设置套件来源 设置套件来源时(http://packages.synocommunity.com)&#xff0c…...

编程日记 2025/5/1 6:23:40

工业控制「混合架构」PK大战 —— 神经网络 + MPC vs 模糊 PID+MPC 的场景选型与实战指南

1. 引言 在工业控制领域&#xff0c;传统的 PID 控制器因其结构简单、稳定性好而被广泛应用&#xff0c;但面对复杂非线性系统时往往力不从心。模型预测控制&#xff08;MPC&#xff09;作为一种基于模型的先进控制策略&#xff0c;能够有效处理多变量、多约束问题&#xff0c…...

编程日记 2025/5/15 19:16:54

树莓派智能摄像头实战指南：基于TensorFlow Lite的端到端AI部署

引言&#xff1a;嵌入式AI的革新力量 在物联网与人工智能深度融合的今天&#xff0c;树莓派这一信用卡大小的计算机正在成为边缘计算的核心载体。本文将手把手教你打造一款基于TensorFlow Lite的低功耗智能监控设备&#xff0c;通过MobileNetV2模型实现实时物体检测&#xff0…...

编程日记 2025/5/15 15:53:55

OpenCV 图形API（73）图像与通道拼接函数-----执行 查找表操作图像处理函数LUT()

操作系统&#xff1a;ubuntu22.04 OpenCV版本&#xff1a;OpenCV4.9 IDE:Visual Studio Code 编程语言&#xff1a;C11 算法描述 对矩阵执行查找表变换。 函数 LUT 使用来自查找表中的值填充输出矩阵。输入矩阵中的值作为查找表的索引。也就是说&#xff0c;函数对 src 中的…...

编程日记 2025/5/15 11:43:43

【MySQL】增删改查（CRUD）

目录 一. CRUD是什么 二. Create&#xff08;新增数据&#xff09; 2.1 单行数据全列插入 2.2 单行数据指定列插入 2.3 多行数据指定列插入 三. Retrieve &#xff08;检索/查询&#xff09; 3.1 全列查询 3.2 指定列查询 3.3 查询字段为表达式 3.4 为查询结果指定别名 3…...

编程日记 2025/5/1 6:22:35

iview 如何设置sider宽度

iview layout组件中&#xff0c;sider设置了默认宽度和最大宽度&#xff0c;在css样式文件中修改无效&#xff0c;原因是iview默认样式设置在了element.style中&#xff0c;只能通过行内样式修改 样式如下&#xff1a; image.png image.png 修改方式&#xff1a; 1.官方文档中写…...

编程日记 2025/5/1 6:22:34

Unity URP RenderTexture优化（二）：深度图优化

目录 前言&#xff1a; 一、定位深度信息 1.1&#xff1a;k_DepthStencilFormat 1.2&#xff1a;k_DepthBufferBits 1.3&#xff1a;_CameraDepthTexture精度与大小 1.4&#xff1a;_CameraDepthAttachment数量 二、全代码 前言&#xff1a; 在上一篇文章&#xff1a;Un…...

编程日记 2025/5/1 6:22:33

iview表单提交验证时，出现空值参数被过滤掉不提交的问题解决

如图所示 有时候在表单提交的时候 个别参数是空值&#xff0c;但是看提交接口的反馈 发现空值的参数根本没传 这是因为表单验证给过滤掉了空值&#xff0c;有时候如果空值传不传都不无所谓&#xff0c;那可以不用管&#xff0c;但如果就算是空值也得传的吗&#xff0c;那就需要…...

编程日记 2025/5/1 6:22:32

GEO vs SEO：从搜索引擎到生成引擎的优化新思路

随着人工智能技术的快速发展&#xff0c;生成引擎优化&#xff08;GEO&#xff09;作为一种新兴的优化策略&#xff0c;逐渐成为企业和内容创作者关注的焦点。与传统的搜索引擎优化&#xff08;SEO&#xff09;相比&#xff0c;GEO不仅关注如何提升内容在搜索结果中的排名&…...

编程日记 2025/5/1 6:21:30

Python-pandas-操作csv文件(读取数据/写入数据)及csv语法详细分享

Python-pandas-操作csv文件(读取数据/写入数据) 提示&#xff1a;帮帮志会陆续更新非常多的IT技术知识&#xff0c;希望分享的内容对您有用。本章分享的是pandas的使用语法。前后每一小节的内容是存在的有&#xff1a;学习and理解的关联性。【帮帮志系列文章】&#xff1a;每个…...

编程日记 2025/5/2 17:06:56

如何在Windows上实现MacOS中的open命令

在MacOS的终端中&#xff0c;想要快速便捷的在Finder中打开当前目录&#xff0c;直接使用oepn即可。 open . 但是Windows中没有直接提供类似open这样的命令&#xff0c;既然没有直接提供&#xff0c;我们就间接手搓一个实现它。 步骤1&#xff1a;创建open.bat echo OFF expl…...

编程日记 2025/5/1 6:21:29

读论文笔记-LLaVA：Visual Instruction Tuning

读论文笔记-LLaVA&#xff1a;Visual Instruction Tuning 《Visual Instruction Tuning》 研究机构&#xff1a;Microsoft Research 发表于2023的NeurIPS Problems 填补指令微调方法&#xff08;包括数据、模型、基准等&#xff09;在多模态领域的空白。 Motivations 人工…...

编程日记 2025/5/12 17:00:22

Vue3源码学习3-结合vitetest来实现mini-vue

文章目录 前言✅ 当前已实现模块汇总&#xff08;mini-vue&#xff09;✅ 每个模块简要源码摘要1. reactive.ts2. effect.ts3. computed.ts4. ref.ts5. toRef.ts6. toRefs.ts ✅ 下一阶段推荐目标所有核心模块对应的 __tests__ 测试文件&#xff0c;**带完整注释**✅ reactive.…...

编程日记 2025/5/1 6:20:27

K8S - 从零构建 Docker 镜像与容器

一、基础概念 1.1 镜像&#xff08;Image&#xff09; “软件的标准化安装包” &#xff0c;包含代码、环境和配置的只读模板。 技术解析 镜像由多个层组成&#xff0c;每层对应一个Dockerfile指令&#xff1a; 应用代码 → 运行时环境 → 系统工具链 → 启动配置核心特性…...

编程日记 2025/5/1 6:20:26

贪心算法求解边界最大数

贪心算法求解边界最大数&#xff08;拼多多2504、排列问题&#xff09; 多多有两个仅由正整数构成的数列 s1 和 s2&#xff0c;多多可以对 s1 进行任意次操作&#xff0c;每次操作可以置换 s1 中任意两个数字的位置。多多想让数列 s1 构成的数字尽可能大&#xff0c;但是不能比…...

编程日记 2025/5/5 8:42:48

C++类和对象(中)

类的默认成员函数 默认成员函数就是用户没有显式实现&#xff0c;编译器会自动生成的成员函数。一个类&#xff0c;我们不写的情况下编译器会默认生成6个默认成员函数&#xff0c;C11以后还会增加两个默认成员函数&#xff0c;移动构造和移动赋值。默认成员函数 很重要&#x…...

编程日记 2025/5/4 21:09:05

（Go Gin）Gin学习笔记（五）会话控制与参数验证：Cookie使用、Sessions使用、结构体验证参数、自定义验证参数

1. Cookie介绍 HTTP是无状态协议&#xff0c;服务器不能记录浏览器的访问状态&#xff0c;也就是说服务器不能区分两次请求是否由同一个客户端发出Cookie就是解决HTTP协议无状态的方案之一&#xff0c;中文是小甜饼的意思Cookie实际上就是服务器保存在浏览器上的一段信息。浏览…...

编程日记 2025/5/1 6:19:22

Windows 10 环境二进制方式安装 MySQL 8.0.41

文章目录 初始化数据库配置文件注册成服务启停服务链接服务器登录之后重置密码卸载 初始化数据库 D:\MySQL\MySQL8.0.41\mysql-8.0.41-winx64\mysql-8.0.41-winx64\bin\mysqld -I --console --basedirD:\MySQL\MySQL8.0.41\mysql-8.0.41-winx64\mysql-8.0.41-winx64 --datadi…...

编程日记 2025/5/15 7:49:32

Day.js一个2k轻量级的时间日期处理库

dayjs介绍 dayjs是一个极简快速2kB的JavaScript库&#xff0c;可以为浏览器处理解析、验证、操作和显示日期和时间&#xff0c;它的设计目标是提供一个简单、快速且功能强大的日期处理工具&#xff0c;同时保持极小的体积&#xff08;仅 2KB 左右&#xff09;。 Day.js 的 API…...

编程日记 2025/5/1 6:19:20

SQL实战：05之间隔连续数问题求解

概述 最近刷题时遇到一些比较有意思的题目&#xff0c;之前多次遇到一些求解连续数的问题&#xff0c;这次遇到了他们的变种&#xff0c;连续数可以间隔指定的数也视为是一个完整的“连续”。针对连续数的这类问题我们之前讲的可以利用等差数列的思想来解决&#xff0c;然而现…...

编程日记 2025/5/14 10:14:04