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

0303hooks-react-仿低代码平台项目

文章目录

    • 1. 副作用
    • 2.其他内置hooks
      • 2.1 useEffect
      • 2.2 useRef
      • 2.3useMemo
      • 2.4 useCallback
    • 3.自定义hooks
    • 4. 第三方hooks
    • 5. hooks使用原则
    • 6. hooks闭包陷阱
    • 7. 总结
    • 结语

1. 副作用

  • 当组件渲染完成时,加载一个Ajax网络请求
  • 当某个state更新时,加载一个Ajax网络请求

示例:

const List2: FC = () => {console.log("加载Ajax网络请求。。。");...	

控制台如下图所示:在这里插入图片描述

分析:函数式组件,任何state更新,都会重新执行函数;组件初次渲染,也会执行函数。

解决这种情况,通过如下其他hooks完成。

2.其他内置hooks

2.1 useEffect

  • useEffect用法

解决“当组件渲染完成时,加载一个Ajax网络请求”问题,如下所示:

  useEffect(() => {console.log("渲染完成");}, []);
// 格式
useEffect(setup, dependencies?)
useEffect(func, [])

组件渲染完成,执行一次。

  • 参数分析:

    • func:函数

    • []:依赖于…触发,默认”空“当前组件。

  • useEffect执行只依赖于[]中指定的变量,可以是多个,任一一个变量更新,都触发函数执行。示例如下

      useEffect(() => {console.log("渲染完成");}, []);useEffect(() => {console.log("questionList change");}, [questionList]);
    
    • 执行组件增、改、删,打印questionList change在这里插入图片描述
  • 组件销毁时触发useEffect,QuestionCard.tsx如下

      useEffect(() => {console.log("QuestionCard mounted");return () => {console.log("QuestionCard unmounted " + id);};}, []);
    
    • 控制台打印如下所示:在这里插入图片描述
  • useEffect监听react组件的声明周期:创建、更新、销毁等。

  • useEffect组件执行创建-销毁-在创建原因:从v18版本开始,在开发环境下会执行该过程;在生成环境中只执行一次。

    yarn build
    把打包好的文件放置在nginx配置的web路径下
    
    • 如下图所示:在这里插入图片描述

2.2 useRef

在 React 开发中,开发者常常需要直接操作 DOM 元素或存储临时数据,但 React 的状态管理机制(如 useState)有时无法满足这些需求。这时,一个名为 useRef 的 Hook 就像一位灵活的“中间人”,在虚拟 DOM 与真实 DOM 之间架起了一座桥梁。本文将深入探讨 useRef 的核心原理、使用场景及进阶技巧,帮助开发者高效利用这一工具解决实际问题。

  • 什么是 useRef?

useRef 是 React 提供的一个 Hook,用于创建可变的引用(reference),其核心特性是:

  1. 不会触发组件重渲染:修改 useRef 的值不会导致组件重新渲染;
  2. 直接访问 DOM 元素:通过 ref 属性绑定到 DOM 元素,获取其真实引用;
  3. 存储临时数据:适合保存不需要触发 UI 更新的临时变量。

示例:

import { FC, useRef } from "react";const Demo: FC = () => {const inputRef = useRef<HTMLInputElement>(null);function selectInput() {const inputEle = inputRef.current;inputEle && inputEle.select();}return (<div><input ref={inputRef} defaultValue="hello world" /><button onClick={selectInput}> 点击选中</button></div>);
};export default Demo;

在这里插入图片描述

  • 一般用于操作DOM
  • 也可传入普通JS变量,单更新不会触发rerender

2.3useMemo

  • 函数组件,每次state更新都会重新执行函数
  • useMemo可以缓存数据,不用每次执行函数都重新生成
  • 可用于计算量较大的场景,缓存提高性能
import { FC, useState, useMemo } from "react";
const Demo: FC = () => {console.log("demo...");const [num1, setNum1] = useState(10);const [num2, setNum2] = useState(20);const [text, setText] = useState("hello");const sum = useMemo(() => {console.log("sum use memo ");return num1 + num2;}, [num1, num2]);return (<><p>{sum} </p><p>{num1}<buttononClick={() => {setNum1(num1 + 1);}}>add num1</button></p><p>{num2}<buttononClick={() => {setNum2(num2 + 1);}}>add num2</button></p><div><input onChange={(e) => setText(e.target.value)} value={text} /></div></>);
};export default Demo;

在这里插入图片描述

2.4 useCallback

  • 和useMemo作用一样,专门用于缓存函数

示例:

import { FC, useState, useCallback } from "react";const Demo: FC = () => {const [text, setText] = useState("hello");const fn1 = () => console.log("fn1 text ", text);const fn2 = useCallback(() => {console.log("fn2 text ", text);}, [text]);return (<><div><button onClick={fn1}>fn1</button><hr /><button onClick={fn2}>fn2</button></div><div><input onChange={(e) => setText(e.target.value)} value={text} /></div></>);
};export default Demo;

缓存,性能优化,提示时间效率。

3.自定义hooks

  • 内置hooks保证基础的功能
  • 内置hooks灵活配合,实现业务功能
  • 抽离公共部分,自定义hooks或者第三方hooks-复用代码

代码演示1:修改网页标题

UseTitle.ts

import { useEffect } from "react";function useTitle(title: string) {useEffect(() => {document.title = title;}, []);
}export default useTitle;

App.tsx

import useTitle from "./hooks/UseTitle";function App() {useTitle("自定义标题1");return (<></>);
}export default App;

在这里插入图片描述

代码演示2:获取鼠标位置

useMouse.ts

import { useState, useEffect } from "react";// 获取鼠标位置,自定义hooks
function useMouse() {const [x, setX] = useState(0);const [y, setY] = useState(0);// 鼠标事件处理const mouseEventHandler = (e: MouseEvent) => {setX(e.clientX);setY(e.clientY);};useEffect(() => {// 监听鼠标事件window.addEventListener("mousemove", mouseEventHandler);//组件销毁时,一定要解绑DOM事件(不解绑,可能出现内存泄露问题)return () => {// 解绑鼠标事件,与绑定时参数相同window.removeEventListener("mousemove", mouseEventHandler);};}, []);return { x, y };
}export default useMouse;

App.tsx

import useMouse from "./hooks/useMouse";function App() {const { x, y } = useMouse();return (<><p>鼠标位置:{x} {y}</p></>);
}export default App;

效果如下图所示:在这里插入图片描述

代码演示3:模拟异步获取数据

useGetInfo.ts

import { useState, useEffect } from "react";// 异步获取信息
function getInfo(): Promise<string> {return new Promise((resolve) => {setTimeout(() => {resolve(new Date().toString());}, 1500);});
}const useGetInfo = () => {const [loading, setLoading] = useState(true);const [info, setInfo] = useState("");useEffect(() => {getInfo().then((info) => {setLoading(false);setInfo(info);});}, []);return { loading, info };
};export default useGetInfo;

App.tsx

import useGetInfo from "./hooks/useGetInfo";function App() {const { loading, info } = useGetInfo();return (<><div>{loading ? "加载中" : info}</div></>);
}export default App;

效果如下图所示:在这里插入图片描述

4. 第三方hooks

常用第三方hooks:文档地址参考下面链接2和链接3

  • ahooks
  • react-use

以ahooks为例,演示:修改网页标题

import { useTitle } from "ahooks";function App() {useTitle("自定义标题2");return (<></>);
}export default App;

演示:获取鼠标位置

import { useMouse } from "ahooks";function App() {const { clientX, clientY } = useMouse();return (<><p>鼠标位置:{clientX} {clientY}</p></>);
}export default App;

5. hooks使用原则

  • 使用useXxx格式命名
  • 只能在两个地方调用hook:组件内,其他hook内。
  • 必须保证每次的调用顺序一致(不能放在if for内部)

6. hooks闭包陷阱

  • 当异步函数获取state时,可能不是当前最新的state
  • 可以使用useRef解决

演示示例:

Cloususe.tsx

import { FC, useState, useRef, useEffect } from "react";const Demo: FC = () => {const [count, setCount] = useState(0);// 累加function add() {setCount(count + 1);}// 打印countfunction printCount() {setTimeout(() => {console.log(count);}, 2000);}return (<><p>闭包陷阱</p><div><p>{count}</p><button onClick={add}>累加</button><button onClick={printCount}>打印</button></div></>);
};export default Demo;

App.tsx

import ClosureTrap from "./ClosureTrap";function App() {return (<><ClosureTrap /></>);
}export default App;

效果如下图所示:在这里插入图片描述

解决方案:

Clousure.tsx

import { FC, useState, useRef, useEffect } from "react";const Demo: FC = () => {const [count, setCount] = useState(0);const countRef = useRef(0);useEffect(() => {countRef.current = count;}, [count]);// 累加function add() {setCount(count + 1);}// 打印countfunction printCount() {setTimeout(() => {console.log(countRef.current);}, 2000);}return (<><p>闭包陷阱</p><div><p>{count}</p><button onClick={add}>累加</button><button onClick={printCount}>打印</button></div></>);
};export default Demo;

效果如下图所示:在这里插入图片描述

7. 总结

目标:

  • 学会内置hooks
  • 学会自定义hooks
  • 学会使用第三方hooks

知识点:

  • 自定义hooks

    • useState

      • Immer:state的不可变数据
    • useEffect

    • useRef

    • useMemo

    • useCallback

  • 第三方hooks

    • ahooks

    • react-use

  • 闭包陷阱

注意事项:

  • hooks是React最重要的内容之一
  • 初学者很难通过概念理解hooks,必须配合大量实践练习
  • hooks有很多规则,遇到错误时,先看是否违反规则

结语

❓QQ:806797785

⭐️仓库地址:https://gitee.com/gaogzhen

⭐️仓库地址:https://github.com/gaogzhen

[1]useEffect[CP/OL].

[2]ahook官网[CP/OL].

[3]github react-use[CP/OL].

相关文章:

0303hooks-react-仿低代码平台项目

文章目录 1. 副作用2.其他内置hooks2.1 useEffect2.2 useRef2.3useMemo2.4 useCallback 3.自定义hooks4. 第三方hooks5. hooks使用原则6. hooks闭包陷阱7. 总结结语 1. 副作用 当组件渲染完成时&#xff0c;加载一个Ajax网络请求当某个state更新时&#xff0c;加载一个Ajax网络…...

Batch Normalization:深度学习训练的加速引擎

引言 在深度学习的发展历程中&#xff0c;训练深度神经网络一直是一项极具挑战性的任务。随着网络层数的增加&#xff0c;梯度消失、梯度爆炸以及训练过程中的内部协变量偏移&#xff08;Internal Covariate Shift&#xff09;问题愈发严重&#xff0c;极大地影响了模型的收敛…...

nacos的地址应该配置在项目的哪个文件中

在 Spring Boot 和 Spring Cloud 的上下文中&#xff0c;​Nacos 的地址既可以配置在 bootstrap.yml 中&#xff0c;也可以配置在 application.yml 中&#xff0c;但具体取决于使用场景和需求。以下是两者的区别和最佳实践&#xff1a; ​1. bootstrap.yml vs application.yml …...

【数据集】 PBMC(Peripheral Blood Mononuclear Cells)数据集

&#x1f9ec; 一、PBMC 数据集简介 内容描述名称Peripheral Blood Mononuclear Cells&#xff08;外周血单个核细胞&#xff09;细胞类型包括 B 细胞、T 细胞、NK 细胞、单核细胞等技术平台通常由 10x Genomics 提供&#xff08;例如 3k、4k、6k、10k 版本&#xff09;数据类…...

3. go-zero中如何使用redis

问题 go-zero项目相关文档中redis是这样配置的&#xff1a; Name: account.rpc ListenOn: 0.0.0.0:8080 Etcd:Hosts:- 127.0.0.1:2379Key: account.rpcMysql:Host: xxxx:3306User: rootPass: xxxData: mall-userCharset: utf8mb4Cache: - Host: 192.168.145.10:6379Type: nod…...

Redis基础知识

Redis基础知识 一、Redis简介 1.1 什么是Redis&#xff1f; Redis是一个开源的、基于内存的数据结构存储系统&#xff0c;可以用作&#xff1a; 数据库缓存消息中间件分布式锁 1.2 Redis特点 高性能&#xff1a;基于内存操作支持多种数据结构支持数据持久化支持主从复制支…...

每日c/c++题 备战蓝桥杯(求解三个数的最大公约数与最小公倍数)

求解三个数的最大公约数与最小公倍数&#xff08;C/C实现&#xff09; 引言 在数学计算和编程问题中&#xff0c;求多个数的**最大公约数&#xff08;GCD&#xff09;和最小公倍数&#xff08;LCM&#xff09;**是常见需求。本文将探讨如何高效求解三个数的GCD和LCM&#xff…...

解决Win11耳机没有声音的问题

方法一&#xff1a;更新驱动程序&#xff08;有效&#xff09; 进入 “设置”&#xff08;快捷键&#xff1a;WinX&#xff09;&#xff0c;点击 “Windows 更新” → “高级选项” 点击 “可选更新” &#xff0c;然后点击 “驱动程序更新” 【注】&#xff1a;更新后可能会出…...

滤波电容的正负极线宽需要一致吗?

今天看到一个项目的滤波电容的正端采用铺铜处理增大过流能力&#xff0c;但是负极却仅仅打了两个地过孔&#xff0c;不仅产生疑问&#xff0c;这样做是否合理&#xff0c;滤波电容的正负极线宽需要一致吗&#xff1f; 搜寻资料的时候看到这样一个类似的问题&#xff1a; 这些人…...

使用 `pandas` 库来读取 Excel 文件,并实现六种算法的遍历计算

以下是一个满足你需求的 Python 程序示例。在这个示例中&#xff0c;我们假设已经有了处理数据的函数&#xff0c;并且生成的 Excel 文件中包含了观测数据和推算数据。我们将使用 pandas 库来读取 Excel 文件&#xff0c;并实现六种算法的遍历计算。 import pandas as pd# 模拟…...

【Linux】文件描述符访问Open、Read、Write

每个运行的程序被称为进程&#xff08;process&#xff09;&#xff0c;它有一些与之关联的文件描述符。我们可以通过这些文件描述符来访问打开的文件或者设备。 一、文件描述符 什么是文件描述符&#xff1f; 概念&#xff1a;文件描述符&#xff08;File Descriptor&#x…...

在 VS2022 中修复 Linux CMake 项目构建失败:从 Ninja 迁移到 Makefile

问题背景​​ 在使用 ​​Visual Studio 2022​​ 开发跨平台 C 项目时&#xff0c;许多开发者会选择通过 ​​WSL (Windows Subsystem for Linux)​​ 直接在本地调试 Linux 环境下的程序。然而&#xff0c;近期在配置一个 CMake 项目时&#xff0c;遇到了以下报错&#xff1…...

ctf-show-mics2

下载文件用zip解压&#xff0c;将文件修改为flp文件 新建虚拟机&#xff0c;把文件添加到软盘 再次打开虚拟机会显示flag flag&#xff1a;flag{ctfshow}...

STM32_USB

概述 本文是使用HAL库的USB驱动 因为官方cubeMX生成的hal库做组合设备时过于繁琐 所以这里使用某大神的插件,可以集成在cubeMX里自动生成组合设备 有小bug会覆盖生成文件里自己写的内容,所以生成一次后注意保存 插件安装 下载地址 https://github.com/alambe94/I-CUBE-USBD-Com…...

Java 基础-32-枚举-枚举的应用场景

在Java编程中&#xff0c;枚举&#xff08;Enum&#xff09;提供了一种强大的方式来定义一组固定的常量。它们不仅限于简单的用途&#xff0c;还可以包含构造函数、方法和字段等高级功能&#xff0c;使其适用于多种不同的应用场景。本文将探讨几种常见的使用枚举的场景&#xf…...

新潮透明液体水珠水滴失真故障扭曲折射特效海报字体标题设计ps样机动作素材 Bubble Photoshop Templates

只需单击几下即可创建引人注目的视觉效果&#xff01;您需要做的就是将您的文本或图像放入智能对象中并应用作。 包中包含&#xff1a; 15 个静态 Photoshop 模板&#xff08;PS 2019 及更高版本&#xff09; 01-05 垂直布局 &#xff08;22504000&#xff09;06-10 水平布局…...

学透Spring Boot — 017. 魔术师—Http消息转换器

本文是我的专栏《学透Spring Boot》的第17篇文章&#xff0c;了解更多请移步我的专栏&#xff1a; 学透 Spring Boot_postnull咖啡的博客-CSDN博客 目录 HTTP请求和响应 需求—新的Media Type 实现—新的Media Type 定义转换器 注册转换器 编写Controller 测试新的medi…...

stable diffusion 量化加速点

文章目录 一、导出为dynamic shape1)函数讲解(函数导出、输出检查)2)代码展示二、导出为static shape1)函数讲解(略)2)代码展示三、序列化为FP32测速1)测速2)代码四、序列化为FP16测速1)测速2)代码同上五、发现并解决解决CLIP FP16溢出,并测速1)如何找到溢出的算子…...

Xorg内存管理机制深度解析

Xorg内存管理机制深度解析 一、客户端资源生命周期管理 Xorg 采用 客户端绑定型资源管理 机制,所有资源(窗口、像素图、字体等)的生命周期与客户端连接状态强关联。 资源 ID 分配机制: • 每个资源由 32位标识符 表示,格式:0xBBCCDDEE ◦ BB:客户端 ID(ClientIndex)…...

第五期:深入理解 Spring Web MVC [特殊字符]( 前后端交互的综合性练习)

✨ 前言&#xff1a;从理解到实战&#xff0c;彻底掌握 Spring MVC 前后端交互 当我们学习了 Spring MVC 中的各种注解、参数绑定、请求方式、编码处理以及 Cookie/Session 操作之后&#xff0c;下一步就是 —— 动手实践&#xff01; 理论再多&#xff0c;不如亲自敲一次代码…...

ansible可视化自动化平台-semaphore

1、简介 Semaphore UI 是一个开源的CI/CD工具&#xff0c;专注于简化和自动化软件交付流程&#xff0c;可轻松管理和运行 Ansible playbook&#xff0c;提供了一个直观的 Web 用户界面&#xff08;UI&#xff09;&#xff0c;帮助DevOps团队轻松管理任务、部署和流水线。 官网…...

手撕LLM(二):从源码出发,探索LoRA加载、推理全流程

接上回接着说&#xff0c;前面我们通过分析源码&#xff0c;了解了大模型推理的详细流程&#xff0c;包括提示词从输入&#xff0c;到对话模版包装&#xff0c;到tokenID转换&#xff0c;到Embedding词向量转换&#xff1b;通过大模型推理&#xff0c;再将大模型输出进行最后一…...

数据库连接JDBC

概述 ✅概念 JDBC(JavaDataBaseConnectivityjava数据库连接)是⼀种⽤于执⾏SQL语句的JavaAPI&#xff0c;可以为多种关系型数据库提供 统⼀访问&#xff0c;它是由⼀组⽤Java语⾔编写的类和接⼝组成的。 本质 其实就是java官⽅提供的⼀套规范(接⼝)。⽤于帮助开发⼈员快速实现…...

VectorBT:使用PyTorch+Transformer训练和回测股票模型 进阶五

VectorBT&#xff1a;使用PyTorchTransformer训练和回测股票模型 进阶五 本方案基于PyTorch框架与Transformer模型&#xff0c;结合VectorBT回测引擎构建多股票量化交易系统&#xff0c;采用滑动窗口技术构建时序特征&#xff0c;通过自注意力机制捕捉市场规律预测收益率&#…...

DP Alt Mode​​ 与 ​​USB​​ 的关系

DP Alt Mode​​ 与 ​​USB​​ 的关系 1. 物理接口的统一&#xff1a;USB-C 是“万能插座” [USB-C接口物理结构] |-----------------------------------------------| | USB 3.0数据引脚 | DP Alt Mode视频引脚 | 电源引脚 | |-------------------------------------…...

C#“与AI的奇妙结合”

原文&#xff1a;C# 使用通义灵码 - AI 助力 Visual Studio 开发_w3cschool &#xff08;注意&#xff1a;本文章中并不存在任何广告&#xff0c;也不存在任何盈利内容&#xff09; C# 使用通义灵码 C# 作为一种功能强大且灵活多变的编程语言&#xff0c;被广泛应用于各个领…...

企业ITR流程设计与执行详细介绍【附全文阅读】

该方案聚焦企业 ITR 流程,适用于企业的服务管理人员、流程优化负责人、技术支持团队以及中高层管理者等。 ITR 流程的重要性:企业服务面临客户不满、管理者焦虑、服务人员无奈等挑战,缺乏完善的 ITR 流程会影响品牌形象、客户满意度和产品竞争力。ITR 流程能够保障客户满意,…...

Ubuntu 无密码热点(Soft AP)完整配置方案

适用于 Jetson、嵌入式 Linux、RDK 平台。目标&#xff1a;配置一个无密码热点&#xff08;Soft AP&#xff09;&#xff0c;供手机等设备直接连接。实现开机自动启动热点&#xff0c;也支持后续一键切换回 WiFi 客户端模式。 平台&#xff1a;Yahboom RDK X3&#xff08;Jetso…...

【力扣hot100题】(063)搜索二维矩阵

看到这题我就想到之前被我当作这题做的【力扣hot100题】&#xff08;020&#xff09;搜索二维矩阵Ⅱ 其实是完全不一样的两题&#xff0c;个人觉得这道题更简单也更考验基础&#xff0c;那道题思路更难想到但代码更好写。 两个二分查找结束&#xff0c;要注意的是第一个二分查…...

瑞萨RA4M2使用心得-KEIL5的第一次编译

目录 前言 环境&#xff1a; 开发板&#xff1a;RA-Eco-RA4M2-100PIN-V1.0 IDE&#xff1a;keil5.35 一、软件的下载 编辑瑞萨的芯片&#xff0c;除了keil5 外还需要一个软件&#xff1a;RASC 路径&#xff1a;Releases renesas/fsp (github.com) 向下找到&#xff1a; …...

玄机-apache日志分析

靶场任务 1、提交当天访问次数最多的IP&#xff0c;即黑客IP&#xff1a; 查看apache日志 apache访问日志的位置是&#xff1a;/var/log/apache2/access.log.1 匹配正则算法 首先先cat看看 发现地址都在第一行&#xff0c;直接匹配计算输出 cat access.log.1 |grep -Eo &…...

[C++]洛谷B2119 删除单词后缀

题目与解析 题干题目描述输入格式输出格式样例样例输入样例输出 答案解析食用提示AC代码AC代码详细解析头文件部分主程序8~12行代码 12行以后的代码 题干 题目描述 给定一个单词&#xff0c;如果该单词以 er、ly 或者 ing 后缀结尾&#xff0c;则删除该后缀&#xff08;题目保…...

Ubuntu远程连接Mysql数据库(图文详解)

Ubuntu远程连接Mysql数据库 1、版本2、检查有没有Mysql2.1 查询是否安装了Mysql包2.2 查看Mysql版本2.3 查看Mysql运行状态 3、卸载Mysql4、安装4.1 更新4.2 开始安装4.3 安装完后查看状态 5、登录5.1、使用5.2、查看数据库权限5.3 更新权限5.4 再次查看数据库权限5.5 添加新用…...

回归预测 | Matlab实现NRBO-Transformer-GRU多变量回归预测

回归预测 | Matlab实现NRBO-Transformer-GRU多变量回归预测 目录 回归预测 | Matlab实现NRBO-Transformer-GRU多变量回归预测预测效果基本介绍程序设计参考资料 预测效果 基本介绍 1.【JCR一区级】Matlab实现NRBO-Transformer-GRU多变量回归预测&#xff0c;牛顿-拉夫逊算法优…...

leetcode122-买卖股票的最佳时机II

leetcode 122 思路 方法一的核心思想是简单的贪心策略。我们每天都看当前价格和下一个价格的差值。如果下一个价格高于当前价格&#xff08;即diff > 0&#xff09;&#xff0c;那么就认为当天可以买入并在第二天卖出&#xff0c;赚取利润。因此&#xff0c;方法一把所有…...

from PIL import Image 安装失败

正确安装 Pillow (PIL) # 通过 Conda 安装 conda install pillow -c conda-forge# 或通过 Pip 安装 pip install pillow验证安装 在 Python 中测试是否成功&#xff1a; from PIL import Image print(Image.__version__) # 应输出类似 "9.5.0" 的版本号常见问题说…...

DPFunc蛋白质功能预测模型复现报告

模型简介 模型的具体介绍见蛋白质功能预测论文阅读记录2025&#xff08;DPFunc、ProtCLIP&#xff09;_protein functions-CSDN博客 复现流程 仓库&#xff1a;CSUBioGroup/DPFunc 时间&#xff1a;2025.4.5 环境配置 python 3.9.21 & CUDA 11.6 Pytorch: 1.12.0 DG…...

在 Ubuntu24.04 LTS 上 Docker Compose 部署基于 Dify 重构二开的开源项目 Dify-Plus

一、安装环境信息说明 硬件资源&#xff08;GB 和 GiB 的主要区别在于它们的换算基数不同&#xff0c;GB 使用十进制&#xff0c;GiB 使用二进制&#xff0c;导致相同数值下 GiB 表示的容量略大于 GB&#xff1b;换算关系&#xff1a;1 GiB ≈ 1.07374 GB &#xff1b;1 GB ≈ …...

双系统ubuntu20.04不能外接显示器的解决办法

一&#xff0c;更换驱动 首先确定是不是英伟达显卡驱动&#xff0c;如果不是的话&#xff0c;设置里找到附加驱动&#xff0c;更改为NVIdia类型的驱动&#xff0c;更改完成之后重启 这里大部分电脑都可以了&#xff0c;如果不行 二、更改启动方式 重启之后进入BIOS设置&…...

高并发内存池:原理、设计与多线程性能优化实践

高并发内存池是一种专门为多线程环境设计的内存管理机制&#xff0c;其核心目标是通过优化内存分配和释放过程&#xff0c;解决传统内存分配器&#xff08;如malloc/free&#xff09;在高并发场景下的性能瓶颈&#xff0c;显著提升多线程程序的内存访问效率。 目录 一、核心设计…...

03.31-04.06 论文速递 聚焦具身智能、复杂场景渲染、电影级对话生成等五大前沿领域

&#x1f31f; 论文速递 | 2025.03.31-04.06 &#x1f4e2; 聚焦具身智能、复杂场景渲染、电影级对话生成等前沿领域 1️⃣ 具身智能体&#xff1a;从脑启发到安全协作系统 论文标题&#xff1a; Advances and Challenges in Foundation Agents: From Brain-Inspired Intellige…...

Django和Celery实现的异步任务案例

推荐超级课程: 本地离线DeepSeek AI方案部署实战教程【完全版】Docker快速入门到精通Kubernetes入门到大师通关课AWS云服务快速入门实战目录 先决条件步骤1:安装依赖项步骤2:配置Celery2.1 创建`celery.py`2.2 更新 `__init__.py`步骤3:配置Django设置步骤4:定义Celery任务…...

DAY 38 leetcode 15--哈希表.三数之和

题号15 给你一个整数数组 nums &#xff0c;判断是否存在三元组 [nums[i], nums[j], nums[k]] 满足 i ! j、i ! k 且 j ! k &#xff0c;同时还满足 nums[i] nums[j] nums[k] 0 。请你返回所有和为 0 且不重复的三元组。 未去重版本 整体思路&#xff1a;先排序再双指针遍…...

Java项目之基于ssm的个性化旅游攻略定制系统(源码+文档)

项目简介 个性化旅游攻略定制系统实现了以下功能&#xff1a; 个性化旅游攻略定制系统能够实现对用户上传信息&#xff0c;旅游路线信息&#xff0c;景点项目信息&#xff0c;景点信息&#xff0c;标签分类信息等信息的管理。 &#x1f495;&#x1f495;作者&#xff1a;落落…...

链表和数组的效率

访问元素 • 数组&#xff1a;通过索引直接访问元素&#xff0c;时间复杂度为O(1)&#xff0c;速度很快。例如arr[5]可以立即访问到数组arr中索引为5的元素。 • 链表&#xff1a;需要从链表头开始逐个遍历节点&#xff0c;直到找到目标元素&#xff0c;平均时间复杂度为O(n)…...

经典回溯问题———组合的输出

题目如下 思路 代码如下...

WPS宏开发手册——附录

目录 系列文章7、附录 系列文章 使用、工程、模块介绍 JSA语法 JSA语法练习题 Excel常用Api Excel实战 常见问题 附录 7、附录 颜色序列&#xff1a;在excel中设置颜色&#xff0c;只能设置颜色序号&#xff0c;不能直接设置rgb颜色 1、黑色 (Black)…...

【leetcode100】买卖股票的最佳时机

1、题目描述 给定一个数组 prices ,它的第 i 个元素 prices[i] 表示一支给定股票第 i 天的价格。 你只能选择 某一天 买入这只股票,并选择在 未来的某一个不同的日子 卖出该股票。设计一个算法来计算你所能获取的最大利润。 返回你可以从这笔交易中获取的最大利润。如果你…...

uniapp小程序登录失效后操作失灵问题

一开始我在请求返回失效验证时做了登录失效处理然后用uni.switchTab跳转主页的逻辑&#xff0c;结果发现在一天后重新打开小程序或者其他登录挤掉登录验证时有概率导致整个页面失灵无法操作。 经过排查发现&#xff0c;在小程序跳转新页面的时候如果遇到**(过快还是过多&#…...

找树左下角的值(DFS 深度优先搜索)| LeetCode 513

✨ 题目描述 给定一个二叉树的 根节点 root&#xff0c;请找出该二叉树的 最底层 最左边 节点的值。 提示&#xff1a; 二叉树中至少有一个节点。 &#x1f4c4; 示例 示例 1 输入: root [2,1,3] 输出: 1示例 2 输入: [1,2,3,4,null,5,6,null,null,7] 输出: 7&#x1f5…...