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

Umi+React+Xrender+Hsf项目开发总结

news 来源：原创 2025/8/16 2:58:42

一、菜单路由配置

1.umirc.ts 中的路由配置

.umirc.ts 文件是 UmiJS 框架中的一个配置文件，用于配置应用的全局设置，包括但不限于路由、插件、样式等。

import { defineConfig } from 'umi';
import config from './def/config';export default defineConfig({plugins: ['@umijs/plugins/dist/model', '@umijs/plugins/dist/request'],model: {},request: {},title: '客服管理后台',publicPath: config.publicPath,favicons: [// 'https://domain.com/favicon.ico',//设置icon],esbuildMinifyIIFE: true,history: {type: 'hash',},routes: [{path: '/',component: '@/pages/business/index',},{path: '/public',component: '@/pages/publicInstance/index',layout: false,ignoreAuth: true,},{path: '/common',name: '通用',icon: 'menu',routes: [{path: '/common/business',name: '业务线管理',component: '@/pages/business/index',},{path: '/common/peopleManage',name: '人员管理配置',component: '@/pages/index',},{path: '/common/skills',name: '技能组管理配置',component: '@/pages/skills/index',},{path: '/common/dialogChange',name: '转交配置',component: '@/pages/dialogChange/index',},],},// 其他路由配置...],
});
主要配置项解释：

  1. defineConfig:

    • 这是一个从 umi 导入的函数，用来创建 Umi 配置对象。它帮助开发者更方便地编写和组织配置。

  2. plugins:

    • 定义使用的插件列表。这里使用了两个插件：@umijs/plugins/dist/model 和 @umijs/plugins/dist/request，它们分别用于状态管理和请求处理。

  3. routes:

    • 定义应用的路由表，每个路由对象可以有以下属性：
      • path: 路由路径。
      • component: 对应路径下加载的组件。
      • routes: 子路由数组，允许嵌套路由。
      • layout: 是否使用布局，默认是 true。当设置为 false 时，表示该路由下的页面不使用全局布局。
      • ignoreAuth: 忽略权限验证，对于无需登录即可访问的公共页面非常有用。
示例分析：

  • 根路径 /:

    • 当用户访问根路径时，会加载 @/pages/business/index 组件。

  • 免登录页面 /public:

    • 访问此路径时，加载 @/pages/publicInstance/index 组件，且设置了 layout: false 和 ignoreAuth: true，意味着这个页面不会使用全局布局，并且不需要进行权限验证。

  • 通用模块 /common:

    • 包含四个子路由，每个子路由都有自己的 path、name 和对应的 component。这些子路由都归属于“通用”分类下，通过 icon 属性可以在侧边栏或导航中显示相应的图标。

2.menuConfig.ts 中的菜单项配置

menuConfig.ts 文件则通常用于定义侧边栏或顶部导航栏的菜单结构。

import React from 'react';
import {BuildOutlined,
} from '@ant-design/icons';
import { MenuProps } from 'antd';// 定义菜单项类型
export type MenuItem = NonNullable<MenuProps['items']>[number];
export const menuData: MenuItem[] = [{key: 'common',icon: React.createElement(BuildOutlined),label: '通用',children: [{key: '/common/business',label: '业务线管理',},// ...更多菜单项],},// ...更多菜单组
];

1. MenuProps['items']

这是从 Ant Design 的 MenuProps 类型中取出 items 属性的类型。

1. NonNullable<...>

  • NonNullable<T> 是 TypeScript 内置的一个工具类型，用于从类型 T 中排除 null 和 undefined。换句话说，它将类型 T 中可能存在的 null 或 undefined 移除掉。

3. [number] 

  • 从 (MenuItemType)[] 中提取出单个元素的类型，即 MenuItemType。

二、hsf接口的调用

1、配置服务信息

import business from '@/pages/business';
import AccessProcess from '@/pages/entrance/accessProcess';
import { access } from 'fs';
import java from 'js-to-java';
import { request } from 'umi';export const isDaily = window.location.host.match(/localhost|.alibaba.net|-test.uc.alibaba-inc.com|30.211.81.4/,
);
export const version1 = isDaily ? '1.0.0.DAILY' : '1.0.0';
export const version2 = isDaily ? '2.0.1.DAILY' : '2.0.1';
export const version3 = isDaily ? '2.0.0.KF.DAILY' : '2.0.0.KF';// 固定的hsf服务信息
const servicer: any = {process: {appName: 'cs-xadmin',pathname: 'xxxx',version: isDaily ? '2.0.1.DAILY' : '2.0.1',},oldProcess: {appName: 'cs-xxflow',pathname: 'xxxx',version: isDaily ? '2.0.1.DAILY' : '2.0.1',},
};
/*** hsf通用调取方法* @param {string} key 对应服务key值（获取pathname:version）* @param {string} className 类名* @param {string} action 方法名* @param {string} appName 应用名* @param {any} data 参数**/
export const hsfApi = async (key: string, { className, action, data }: any) => {// 如果是日常环境 & 路径上带有connectToLocalHsf参数，则调用本地hsf，把version中的DAILY 替换为 LOCALlet version = servicer[key]?.version;if (isDaily && window.location.hash.includes('connectHsf=local')) {version = servicer[key].version.replace('DAILY', 'LOCAL');}return request(`/api/hsf?action=${action}`, {method: 'POST',data: {pathname: `${servicer[key]?.pathname}:${version}`,action,appName: servicer[key].appName,data:data && className? [java(className, {...data,}),]: [],},});
};
pathname：
 appName：

 

2、封装请求函数

// @ts-ignore
/* eslint-disable */
import { hsfApi } from '@/utils/api';/*** 分页查询技能组溢出规则* @param params 查询参数*/
export async function pageList(params: {pageNo?: number;pageSize?: number;name?: string;fromSkillgroupId?: number;toSkillgroupId?: number;
}) {return hsfApi('onlineDispatch', {className: 'com.uc.cs.xadmin.client.param.dispatchschedule.PageOnlineDispatchScheduleParam',action: 'pageList',data: {...params,}});
className： 

className： 

 

 

参数解释：
  • 'onlineDispatch'：
    • 表示要调用的服务名，对应你在 api.ts 中配置的 servicer 对象里的键值。
    • 会去查找该服务的应用名、路径、版本等信息。
  • className：
    • 表示你这次请求的参数在后端对应的 Java 类型。
  • action: 'pageList'：
    • 表示你要调用的方法名，即后端服务提供的某个接口方法。
  • data: { ...params }：
    • 把传入的 params 参数展开并传入请求体中。
    • 最终会被包装成一个 Java 对象发送到后端

 

三、页面开发

1、父组件

（1）懒加载

import React from 'react';
const AddEditModal = React.lazy(() => import('./components/AddEditModal'));

 React.lazy 是 React 提供的一个用于实现代码分割的功能。通过 React.lazy 和动态 import() 语法，你可以按需加载组件，而不是在应用初始化时就加载所有组件。

（2）useMemo

  const schema = useMemo(() => getOnlineDispatchSchema(groupValues), [groupValues]);

useMemo 是一个用于记忆化的 Hook，它接收两个参数：

  1. 一个创建函数：该函数返回需要被记忆化的值。
  2. 一个依赖项数组：只有当这些依赖项发生变化时，才会重新计算记忆化的值；否则将返回之前记忆化的结果。
  const columns: any = useMemo(() => {   {title: '最后修改信息',dataIndex: 'modifyInfo', // 可以不绑定真实字段，仅占位width: 200,render: (_: any, record: any) => {const modifyTime = dayjs(record.modifyTime).format('YYYY-MM-DD HH:mm:ss');const modifier = record.modifier || '未知';return (<div style={{ lineHeight: 1.5 }}><div>{modifyTime}</div><div>{modifier}</div></div>);},},
}

（3）render

render: (_: any, record: any) => {} 的用法

  1. _：当前列的值。有时你可能不需要使用这个值，所以通常用下划线 _ 来表示忽略这个参数。

  2. record：当前行的所有数据。这是一个对象，包含了该行所有字段的信息。

（4）请求缓存避免发起多个相同请求 

// 在组件外部创建缓存
const skillGroupsCache = {data: null as SkillGroup[] | null,promise: null as Promise<SkillGroup[] | null> | null // 允许Promise返回null
};const fetchSkillGroups = async () => {if (skillGroupsCache.data) return skillGroupsCache.data;if (skillGroupsCache.promise) return skillGroupsCache.promise;skillGroupsCache.promise = (async () => {try {const result = await index({/* 参数 */});skillGroupsCache.data = result.code === 200 ? result.data.rows?.map((v: SkillGroupResponse)  => ({ label: v.name, value: v.id })) || []: [];return skillGroupsCache.data;} catch (error) {console.error('获取技能组失败:', error);return [];} finally {skillGroupsCache.promise = null;}})();return skillGroupsCache.promise;
};
缓存对象 skillGroupsCache

  • data：用于存储从服务器获取到的技能组数据。如果已经成功获取了数据，则直接使用缓存的数据，无需再次发起网络请求。

  • promise：用于存储正在进行中的异步请求，这样可以确保在同一个数据获取过程中，如果有多个地方同时请求相同的数据，它们将共享同一个请求结果，而不是各自发起新的请求。

  1. 检查缓存数据：

    • 首先检查 skillGroupsCache.data 是否已经有值。如果有，说明之前已经成功获取过数据，直接返回缓存的数据，避免重复请求。

  2. 检查进行中的请求：

    • 如果没有缓存的数据，但 skillGroupsCache.promise 不为空，说明当前有一个正在进行中的请求。在这种情况下，直接返回这个正在进行中的请求（Promise），所有调用者将等待同一个请求的结果，而不是各自发起新的请求。

  3. 发起新请求：

    • 如果既没有缓存的数据也没有正在进行中的请求，则创建一个新的异步请求来获取数据，并将其存储在 skillGroupsCache.promise 中。
    • 在请求成功后，将获取到的数据存储在 skillGroupsCache.data 中，并清空 skillGroupsCache.promise。
    • 如果请求失败，记录错误信息并返回一个空数组。

  4. 清理：

    • 无论请求成功还是失败，在 finally 块中都会将 skillGroupsCache.promise 设置为 null，以便后续的请求可以正常发起。

（5）初始化状态锁

 // 添加初始化状态锁const initializedRef = useRef(false);// 初始化数据useEffect(() => {console.log('initializedRef.current',initializedRef.current);if (initializedRef.current) return;initializedRef.current = true;const initData = async () => {setSpinning(true);try {setTableHeight(useInitTableHeight(-10));const [groups, pageData] = await Promise.all([fetchSkillGroups(),fetchPageList({ pageNo: 1, pageSize: 20 }) // 合并初始化请求]);setGroupValues(groups || []);setRawTableData(pageData.data.data.list || []);// setInitialized(true);} catch (error) {console.error('初始化失败:', error);} finally {setSpinning(false);}};initData();
}, []);

通过 if (initializedRef.current) return; 来判断是否已经执行过初始化操作。如果已经初始化则直接返回，不重复执行初始化逻辑。

使用 useRef 而不是 useState 的原因

  • useRef：useRef 返回一个可变的引用对象，其 .current 属性在组件的整个生命周期内保持不变。修改 .current 属性不会触发组件的重新渲染。

  • useState：每次调用 setState 函数都会导致组件重新渲染。如果我们使用 useState 来管理初始化状态，那么每当更新该状态时，都会导致组件重新渲染，这可能会引起性能问题或意外的行为。

（6）??和...运算符

  // 构造请求参数const payload: Record<string, any> = {pageNo: current ?? 1,pageSize: pageSize ?? 20,...(onlineDispatchName && { name: onlineDispatchName }),...(overflowSkillGroup && { fromSkillgroupId: overflowSkillGroup }),...(inflowSkillGroup && { toSkillgroupId: inflowSkillGroup }),...(modifier && { modifier }),};
??对比逻辑或运算符 (||)

在 ES2020 之前，开发者通常使用逻辑或运算符 (||) 来提供默认值。但是，|| 运算符会在左侧操作数是任何假值（如 0, false, '' 等）时也返回右侧的默认值

let current = 0;
console.log(current || 1); // 输出: 1 （可能不符合预期）
console.log(current ?? 1); // 输出: 0 （符合预期）

相关文章：

Umi+React+Xrender+Hsf项目开发总结

一、菜单路由配置 1.umirc.ts 中的路由配置 .umirc.ts 文件是 UmiJS 框架中的一个配置文件&#xff0c;用于配置应用的全局设置&#xff0c;包括但不限于路由、插件、样式等。 import { defineConfig } from umi; import config from ./def/config;export default defineCon…...

编程日记 2025/8/16 2:58:42

【软件设计师：数据结构】1.数据结构基础（一）

一 线性表 1.线性表定义 线性表是n个元素的有限序列，通常记为(a1，a2，…，an)。 特点： 存在惟一的表头和表尾。除了表头外，表中的每一个元素均只有惟一的直接前驱。除了表尾外，表中的每一个元素均只有惟一的直接后继。2.线性表的存储结构 (1)顺序存储 是用一组地址连续…...

编程日记 2025/8/16 2:58:40

linux_进程地址空间（虚拟地址空间）

一、进程地址空间是什么&#xff1f; 先看这样一个具体的例子 #include<stdlib.h> #include <stdio.h> #include<unistd.h> int main() {int a1;pid_t idfork();while(1){if(id0){printf("i am child,pid:%d,ppid:%d,a:%d ,&a:%p\n",getpid(…...

编程日记 2025/8/16 2:58:38

计操第四章存储管理

地址再定位...

编程日记 2025/8/16 2:58:36

尚硅谷-硅谷甄选项目记录

一、Vue3 1 基础配置 1.1 路径别名 vite.config.ts import { defineConfig } from vite import vue from vitejs/plugin-vue// 引入path&#xff0c;node提供的模块&#xff0c;可以获取文件或文件夹的路径 import path from pathexport default defineConfig({plugins: […...

编程日记 2025/8/16 2:58:35

c# LINQ-Query01

文章目录 查询数据源标准查询分两类即时查询已推迟流式处理非流式处理分类表聚合Aggregate<TSource,TAccumulate,TResult>(IEnumerable<TSource>, TAccumulate, Func<TAccumulate,TSource,TAccumulate>, Func<TAccumulate,TResult>)Aggregate<TSour…...

编程日记 2025/8/16 2:58:33

Vue3渲染引擎：虚拟DOM与响应式原理

Vue3渲染引擎&#xff1a;虚拟DOM与响应式原理 在当今的前端开发中&#xff0c;Vue.js作为一种流行的JavaScript框架&#xff0c;经常被用来构建用户界面。而Vue.js 3作为其最新版本&#xff0c;在性能和功能上进行了许多优化和改进。其中&#xff0c;Vue3渲染引擎的核心原理—…...

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

[dify]官方模板DeepResearch工作流学习笔记

一、功能 根据用户输入的主题进行多轮搜索并生成综合报告 1、流程分析 1.1 初始阶段 Start节点&#xff1a;接收用户输入的"depth"参数&#xff0c;决定搜索的深度/轮数 参数可以不填&#xff0c;不填的时候取默认值3 Create Array节点&#xff1a;根据depth参数…...

编程日记 2025/8/16 2:58:29

大模型系列（四）--- GPT2: Language Models are Unsupervised Multitask Learners​

论文链接&#xff1a; Language Models are Unsupervised Multitask Learners 点评&#xff1a; GPT-2采用了与GPT-1类似的架构&#xff0c;将参数规模增加到了15亿&#xff0c;并使用大规模的网页数据集WebText 进行训练。正如GPT-2 的论文所述&#xff0c;它旨在通过无监督语…...

编程日记 2025/8/16 1:17:51

日语学习-日语知识点小记-构建基础-JLPT-N4阶段（15）：何と どういう

日语学习-日语知识点小记-构建基础-JLPT-N4阶段&#xff08;15&#xff09;&#xff1a;何と &どういう 1、前言&#xff08;1&#xff09;情况说明&#xff08;2&#xff09;工程师的信仰 2、知识点&#xff08;1&#xff09;かもしれません　&#xff06;　&#xff5e;…...

编程日记 2025/8/16 1:27:11

基于英特尔 RealSense D455 结构光相机实现裂缝尺寸以及深度测量

目录 一&#xff0c;相机参数规格 二&#xff0c;结合YOLO实例分割实现裂缝尺寸以及深度测量 2.1 应用场景 2.2 实现流程 2.3 效果展示 2.4 精度验证 2.5 实物裂缝尺寸以及深度测量效果展示 一&#xff0c;相机参数规格 英特尔 RealSense D455 是英特尔 RealSense D400 系…...

编程日记 2025/8/16 2:58:27

利用并行处理提高LabVIEW程序执行速度

在 LabVIEW 编程中&#xff0c;提升程序执行速度是优化系统性能的关键&#xff0c;而并行处理技术则是实现这一目标的有力武器。通过合理运用并行处理&#xff0c;不仅能加快程序运行&#xff0c;还能增强系统的稳定性和响应能力。下面将结合实际案例&#xff0c;深入探讨如何利…...

编程日记 2025/8/16 2:58:25

C++并发编程完全指南：从基础到实践

在当今多核处理器普及的时代&#xff0c;充分利用硬件并发能力已成为高性能编程的关键。C11引入的现代并发编程支持使得开发者能够以标准化、可移植的方式编写多线程程序。本文将全面介绍C并发编程的各个方面&#xff0c;从基础概念到实际应用&#xff0c;帮助您掌握这一重要技…...

编程日记 2025/8/16 2:58:23

vue3 element-plus 输入框回车跳转页面问题处理

问题描述&#xff1a; 当页面搜索条件只有一个的情况下&#xff0c;输入框不管有没有值&#xff0c;回车后会跳转页面 解决办法&#xff0c;给表单添加 submit.prevent <el-form ref"ruleForm" :model"search" label-width"120px" class&qu…...

编程日记 2025/8/15 21:16:25

从0开始学习大模型--Day03--Agent规划与记忆

规划&#xff08;planning&#xff09; 规划&#xff0c;可以为理解观察和思考。如果用人类来类比&#xff0c;当我们接到一个任务&#xff0c;我们的思维模式可能会像下面这样: 1、首先会思考怎么完成这个任务。 2、然后会审视手头上所拥有的工具&#xff0c;以及如何使用这…...

编程日记 2025/8/15 16:22:30

DevExpressWinForms-AlertControl-使用教程

文章目录 AlertControl-使用教程一、将 AlertControl 添加到 Form二、编辑 AlertControl 的 HtmlTemplateHTML Template Editor介绍编辑HTML Template 三、使用AlertControl弹出AlertAlert中的按钮事件获取 Alert 标题等信息向Alert传递参数 总结源码 AlertControl-使用教程 一…...

编程日记 2025/8/16 2:58:20

配电站室智能巡检：机器人 VS 固定摄像头，谁更胜一筹？

在配电站室巡检领域&#xff0c;传统人工巡检正逐渐被智能化手段取代。其中&#xff0c;机器人巡检与固定摄像头巡检成为两大热门选择。那么&#xff0c;它们究竟谁更胜一筹&#xff1f; 一、机器人巡检与固定摄像头巡检的对比 目前人工巡检工作主要以查看表计&#xff0c;设…...

编程日记 2025/8/15 14:23:49

脑图谱：脑机接口的必由之路——技术突破与产业转化的系统性思考

一、三维发育小鼠大脑图谱框架（DevCCF） 1. 技术原理与核心创新 DevCCF框架由宾夕法尼亚州立大学团队主导开发，其技术突破体现在多模态数据融合与跨尺度分析能力的革新： 多模态成像整合：采用高分辨率MRI（空间分辨率50-100μm）捕捉全脑宏观结构动态变化，结合光片荧光显…...

编程日记 2025/8/16 2:58:16

【网络编程】二、UDP网络套接字编程详解

文章目录 前言Ⅰ. UDP服务端一、服务器创建流程二、创建套接字 -- socketsocket 属于什么类型的接口❓❓❓socket 是被谁调用的❓❓❓socket 底层做了什么❓❓❓和其函数返回值有没有什么关系❓❓❓三、绑定对应端口号、IP地址到套接字 -- bind四、数据的发送和接收 -- `sendto…...

编程日记 2025/8/16 2:58:15

缓存替换算法与存储器管理的分页、分段、段页式管理联系

缓存替换算法与存储器管理的分页、分段、段页式管理在目标和机制上存在相似性&#xff0c;均涉及高效资源分配和地址映射&#xff0c;但应用层级和具体场景不同。以下是它们的联系与区别分析&#xff1a; 1. 核心联系&#xff1a;资源管理的共性 替换策略的必要性 无论是缓存&a…...

编程日记 2025/8/16 2:58:13

AI大模型基础设施：NVIDIA GPU和AMD MI300系列的区别

本文将从架构设计、性能、内存、功耗、软件生态、价格与性价比、供应链与市场表现等多个维度对比英伟达的GPU&#xff08;以H100为代表&#xff09;和AMD的Instinct MI300系列处理器&#xff08;以MI300X GPU和MI300A APU为主&#xff09;。以下是详细分析&#xff1a; 1. 架构…...

编程日记 2025/8/16 5:46:43

基于Matlab实现耦合模理论仿真程序

耦合模理论&#xff08;Coupled Mode Theory&#xff0c;简称CMT&#xff09;是一种广泛应用于光子学、微波工程和电子学领域的理论框架&#xff0c;用于分析和理解多模系统的相互作用。 耦合模理论主要研究两个或多个模式之间的能量交换&#xff0c;这些模式可以是电磁波、声…...

编程日记 2025/8/16 5:46:40

图片文件转base64存储在数据库

以下是将文件转换为Base64编码字符串的Java代码&#xff1a; import java.io.File; import java.io.FileInputStream; import java.io.IOException; import java.util.Base64;public class ImageToBase64 {/*** 将图片文件转换为Base64字符串* param filePath 图片文件路径* r…...

编程日记 2025/8/15 22:17:46

我的世界云端服务器具体是指什么？

我的世界云端服务器是指一种基于互联网的多人游戏服务器&#xff0c;将游戏服务器运行在云平台上&#xff0c;而不是在本地计算机中&#xff0c;这使用户不需要考虑自身电脑的性能和网络稳定性&#xff0c;只需要通过网络连接到云端服务器&#xff0c;就可以享受到顺畅的游戏体…...

编程日记 2025/8/16 5:46:36

shell脚本实现远程重启多个服务器

直接deepseek帮写脚本 remoteReboot.sh #!/bin/bash # 配置文件路径&#xff08;格式&#xff1a;每行一个服务器地址&#xff09; SERVER_FILE"servers.list" # 读取服务器列表 mapfile -t SERVERS < "$SERVER_FILE" for server in "${SERVER…...

编程日记 2025/8/16 2:24:39

怎样快速变换 json 串里的多层集合

有一个 2 层的 json 串&#xff0c;下层是多个动态的 key-value&#xff0c;不含集合 / 数组类型。 {"Games": {"key1": "value1", "key2": value2,"key3":value3}} 现在要把下层变换成多层的集合。 {"Games":…...

编程日记 2025/8/16 5:46:32

FreeCAD傻瓜教程-涡轮蜗杆的快速绘制FCGear工作台的使用方法

起因&#xff1a;涡轮蜗轴的组合&#xff0c;是一种比较简单且高效的传动结构。可以实现减速、加速、转动角度的放大、缩小等应用。 如何绘制呢&#xff1f;我搜索了不少教程&#xff0c;看起来都挺复杂的&#xff0c;对于小白来说有点像天书。这里介绍和记录一下利用FreeCAD 的…...

编程日记 2025/8/16 5:46:29

【论文阅读】HunyuanVideo: A Systematic Framework For Large Video Generative Models

HunyuanVideo: A Systematic Framework For Large Video Generative Models 原文摘要 研究背景与问题 视频生成的变革性影响&#xff1a;近期视频生成技术的进步深刻改变了个人生活与行业应用。 闭源模型的垄断&#xff1a;主流视频生成模型&#xff08;如Runway Gen-3、Luma …...

编程日记 2025/8/15 6:38:54

Search After+PIT 解决ES深度分页问题

1.深分页和search after 原理 深分页 (from/size)search_after数据定位全局排序后跳过前 N 条基于上一页最后一条的排序值定位排序开销每次请求重新全局排序 (O(N))仅首次全局排序&#xff0c;后续游标跳转 (O(1))内存消耗堆内存存储完整结果集 (高风险OOM)无堆内存累积 (安全…...

编程日记 2025/8/16 5:46:24

c语法高阶—（联合体，枚举，位域，编译器，宏定义，条件编译，条件编译，头文件）

目录 一 联合体&#xff08;重要&#xff09; 特性 总结 二 枚举&#xff08;重要&#xff09; 特性 总结&#xff1a; 三 位域&#xff08;了解&#xff09; 定义 特性 使用场景 优缺点分析表 位域的特点和使用方法 总结&#xff1a; 四 编译器&#xff08;linux…...

编程日记 2025/8/16 5:46:22

SQL Server To Paimon Demo by Flink standalone cluster mode

需求&#xff1a;使用 Flink CDC 测试 SQL Server 连接 Paimon 操作&#xff1a;启动 Flink standalone cluster 后&#xff0c;接着启动 Flink SQL Client&#xff0c;则通过 Flink SQL Client 提交 insert & select job 到该 8081 cluster Flink SQL Client 执行案例 -…...

编程日记 2025/8/16 5:46:19

常用设计模式在 Spring Boot 项目中的实战案例

引言​ 在当今的软件开发领域&#xff0c;Spring Boot 以其高效、便捷的特性成为构建 Java 应用程序的热门框架。而设计模式作为软件开发中的宝贵经验总结&#xff0c;能够显著提升代码的可维护性、可扩展性和可复用性。本文将深入探讨几种常用设计模式在 Spring Boot 项目中的…...

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

4、反应釜压力监控系统 - /自动化与控制组件/reaction-vessel-monitor

76个工业组件库示例汇总 反应釜压力监控组件 这是一个用于反应釜压力监控的自定义组件&#xff0c;专为化工厂反应釜压力监控设计。采用苹果工业风格界面&#xff0c;简洁优雅&#xff0c;功能实用&#xff0c;易于使用。 功能特点 实时压力可视化&#xff1a;直观展示反应…...

编程日记 2025/8/16 5:46:15

五、Hadoop集群部署：从零搭建三节点Hadoop环境（保姆级教程）

作者&#xff1a;IvanCodes 日期&#xff1a;2025年5月7日 专栏&#xff1a;Hadoop教程 前言&#xff1a; 想玩转大数据&#xff0c;Hadoop集群是绕不开的一道坎。很多小伙伴一看到集群部署就头大&#xff0c;各种配置、各种坑。别慌&#xff01;这篇教程就是你的“救生圈”。 …...

编程日记 2025/8/16 5:46:12

详细剖析传输层协议（TCP和UDP）

详细讲解传输层的网络协议&#xff0c;为什么TCP是可靠连接协议&#xff0c;凭什么能做到不丢包&#xff0c;有哪些机制保证可靠呢&#xff1f; TCP/UDP UDPTCP**三次握手和四次挥手****滑动窗口****拥塞控制**&#xff08;socket套接字&#xff09;**listen的第二个参数** UD…...

编程日记 2025/8/16 5:46:10

ZYNQ移植FreeRTOS与OpenAMP双核开发实践指南

ZYNQ系列芯片凭借其“ARM处理器（PS）+ FPGA（PL）”的异构架构，在嵌入式系统中被广泛应用于高性能计算与实时控制场景。然而，如何高效利用其双核资源并实现实时操作系统（如FreeRTOS）的移植与双核通信，是开发者面临的关键挑战。本文将深入探讨FreeRTOS移植、双核固化启动以…...

编程日记 2025/8/16 5:46:07

VUE+ElementUI 使用el-input类型type=“number” 时，取消右边的上下箭头

项目场景&#xff1a; 提示&#xff1a;这里简述项目相关背景&#xff1a; 在项目中有时候需要输入框的type“number”&#xff0c;这个时候&#xff0c;输入框的右边就会出现两个按钮&#xff0c;这两个按钮可以递增/递减&#xff0c;但是这样输入框看上去就不太美观&#x…...

编程日记 2025/8/16 5:46:04

RabbitMQ高级特性

1.消息的可靠投递 在使用 RabbitMQ 的时候&#xff0c;作为消息发送方希望杜绝任何消息丢失或者投递失败场景。RabbitMQ 为我们提供了两种方式用来控制消息的投递可靠性模式。 1.confirm 确认模式 2.return 退回模式 rabbitmq 整个消息投递的路径为&#xff1a; producer…...

编程日记 2025/8/16 5:46:00

在Python中调用C/C++函数并与MPI集成

在Python中调用C/C函数并与MPI集成 要在Python环境中调用C/C函数并让Python和C/C端都能使用MPI进行通信&#xff0c;有几种方法可以实现。下面我将介绍几种常见的方法。 方法一&#xff1a;使用mpi4py C/C MPI扩展 1. 准备工作 首先确保你已安装: MPI实现 (如OpenMPI或MP…...

编程日记 2025/8/16 5:45:58

软件架构评估方法全面解析

介绍 在软件开发过程中&#xff0c;架构设计的好坏直接影响系统的可维护性、可扩展性和性能。因此&#xff0c;软件架构评估&#xff08;Software Architecture Evaluation&#xff09;成为确保架构质量的关键步骤。本文将介绍几种主流的架构评估方法&#xff0c;包括ATAM、SA…...

编程日记 2025/8/16 5:45:56

场景可视化与数据编辑器：构建数据应用情境​

场景可视化是将数据与特定的应用场景相结合&#xff0c;借助数据编辑器对数据进行灵活处理和调整&#xff0c;通过模拟和展示真实场景&#xff0c;使企业能够更直观地理解数据在实际业务中的应用和影响&#xff0c;为企业的决策和运营提供有力支持。它能够将抽象的数据转化为具…...

编程日记 2025/8/15 17:23:22

MATLAB导出和导入Excel文件表格数据并处理

20250507 1.MATLAB使用table函数和writetable函数将数据导出Excel表格文件 我们以高斯函数为例子&#xff0c;高斯函数在数学和工程领域有着广泛的应用&#xff0c;它的一般形式为&#xff1a; 其中是均值&#xff0c;决定了函数的中心位置&#xff1b; 是标准差&#xff0c;决…...

编程日记 2025/8/16 5:45:52

2025年渗透测试面试题总结-渗透岗位全职工作面试（附回答）（题目+回答）

网络安全领域各种资源&#xff0c;学习文档&#xff0c;以及工具分享、前沿信息分享、POC、EXP分享。不定期分享各种好玩的项目及好用的工具&#xff0c;欢迎关注。 目录 一、通用基础类问题 1. 自我介绍 2. 职业动机与规划 3. 加班/出差接受度 二、安全技术类问题 1. 漏…...

编程日记 2025/8/16 5:45:50

【django.db.utils.OperationalError: unable to open database file】

解决platform.sh 环境下&#xff0c;无法打开数据库问题 场景 在platform.sh 执行python manage.py createsuperuser是提示 django.db.utils.OperationalError: unable to open database file 错误 原因 由于settings.py文件中 本地数据库配置在线上配置后&#xff0c;导致…...

编程日记 2025/8/16 5:45:48

【人工智能】解锁AI潜能：LM Studio多模型并行运行DeepSeek与开源大模型的实践指南

《Python OpenCV从菜鸟到高手》带你进入图像处理与计算机视觉的大门！ 解锁Python编程的无限可能：《奇妙的Python》带你漫游代码世界 随着大语言模型（LLM）的快速发展，LM Studio作为一款本地化部署工具，以其简单易用的图形化界面和强大的模型管理能力受到广泛关注。本文深…...

编程日记 2025/8/16 5:45:45

集群免密登录

免密登录原理 核心步骤 在hadoop100上 生成密钥对。把hadoop100的公钥发到hadoop101上。在hadoop100上登录hadoop101&#xff0c;验证效果 具体操作 登录 hadoop100。使用finalshell连接。在hadoop100上&#xff0c;运行命令&#xff1a;ssh-keygen -t rsa。然后根据提示连续敲…...

编程日记 2025/8/16 5:45:43

【C/C++】errno/strerror 和 GetLastError()/FormatMessage 的区别

strerror 和 errno 详解 printf("Error: %s\n", strerror(errno));这行代码用于在 C 语言中输出系统错误信息&#xff0c;但它与 Windows 的 GetLastError() 有重要区别。下面我将详细解释每个部分及其工作原理。 1. 组件解析 errno 定义&#xff1a;errno 是一个…...

编程日记 2025/8/16 5:45:41

ASP.NET MVC4 技术单选及多选题目汇编

一、单选题&#xff08;共50题&#xff0c;每题2分&#xff09; 1、ASP.NET MVC4 的核心架构模式是什么&#xff1f; A. MVP B. MVVM C. MVC D.三层架构 答案&#xff1a;C 2、在 MVC4 中&#xff0c;默认的路由配置文件名是&#xff1f; A. Global.asax B. RouteConfig.cs C.…...

编程日记 2025/8/16 5:45:39

趣味编程：梦幻万花筒

目录 1.效果展示 2.源码展示 3.代码逻辑详解 3.1 头文件与宏定义 3.2 HSV函数转RGB颜色函数 3.3 主函数 初始化部分 循环部分 线条绘制部分 刷新和延时部分 结束部分 4.小结 本篇博客主要介绍趣味编程用C语言实现万花筒小程序。 1.效果展示 2.源码展示 #define…...

编程日记 2025/8/16 5:45:37

使用 Selenium 截图功能，截不到原生 JavaScript 弹窗

本篇内容源自ai注意甄别 Selenium WebDriver 的标准截图 (getScreeenshotAs) 捕获的是浏览器渲染的 DOM 内容&#xff0c;而 JavaScript 的 alert()、confirm()、prompt() 这类弹窗是浏览器级别的原生 UI 元素&#xff0c;它们不属于页面的 DOM 结构。 为什么会这样&#xff…...

编程日记 2025/8/16 5:45:35