React 其他 Hooks
其他 Hooks
useRef
可用于获取 DOM 元素
const ScrollRef = useRef(null)ScrollRef.current
useContext
(先回顾一下之前的 Context 知识,借用之前 ppt 和源码)
Hooks 中使用 useContext 来获取 context 的值
// 父组件创建 contextexport const MenuContext = createContext<IMenuContext>({ index: 0 }) // 初始值// context 传递的数据const passedContext: IMenuContext = {index: currentActive ? currentActive : 0,onSelect: handleClick,}<MenuContext.Provider value={passedContext}>{renderChildren()}</MenuContext.Provider>// 子组件使用const context = useContext(MenuContext)context.onSelect(index)
useReducer

useReducer 和 redux 不同
useReducer 是
useState的代替方案,用于更复杂的 state 变化逻辑useReducer 是
单组件的状态管理,多组件通讯还是需要 props 传递数据redux 是
全局的状态管理,多组件可共享数据
useMemo
(先回顾一下之前的性能优化部分的知识,借用之前 ppt 和源码)
React 默认更新
所有子组件
Class 组件使用 SCU 或者 PureComponent 进行优化
Hooks里使用 useMemo 缓存数据(和 PureComponent 原理是一样的)
// 子组件使用 memo()包裹 (对props浅层对比)const Child = memo(({ userInfo }) => {console.log('Child render ...', userInfo)return <></>})// 父组件 用 useMemo 缓存传递的数据, 有依赖const userInfo = useMemo(() => {return { name, age = 21 }}, [name])<Child userInfo={userInfo}/>
useCallback
在 useMemo 的基础上继续,如果是函数传递给子组件,怎么办?
useMemo 缓存
数据useCallback 缓存
函数
// 子组件const Child = ({ onChange }) => {console.log('Child render ...', onChange)return <></>}// 父组件 用 useCallback 缓存传递的函数, 依赖 []const onChange = useCallback(e => {console.log(e.target.value)}, [])<Child onChange={onChange}/>
相关文章:
React 其他 Hooks
其他 Hooks useRef 可用于获取 DOM 元素 const ScrollRef useRef(null)ScrollRef.current useContext (先回顾一下之前的 Context 知识,借用之前 ppt 和源码) Hooks 中使用 useContext 来获取 context 的值 // 父组件创建 contextexpor…...
echarts配置记录,一些已经废弃的写法
1、normal,4.0以后无需将样式写在normal中了 改前: 改后: DEPRECATED: normal hierarchy in labelLine has been removed since 4.0. All style properties are configured in labelLine directly now. 2、axisLabel中的文字样式无需使用te…...
电量计量芯片HLW8110的前端电路设计与误差分析校正.pdf 下载
电量计量芯片HLW8110的前端电路设计与误差分析校正.pdf 下载地址: 链接:https://pan.baidu.com/s/1vlCtC3LGFMzYpSUUDY-tEg 提取码:8110...
Redis实践记录与总结
最近生产环境缓存数据库数据过大(如何搭建单服务redis缓存数据库?以及可视化工具Another Redis Desktop Manager使用),导致在对数据库做rdb快照备份时消耗内存过大,缓存数据库宕机一小时。基础运维通过增加虚拟机内存暂…...
持续总结中!2024年面试必问 20 道 Rocket MQ面试题(三)
上一篇地址:持续总结中!2024年面试必问 20 道 Rocket MQ面试题(二)-CSDN博客 五、什么是生产者(Producer)和消费者(Consumer)在RocketMQ中? RocketMQ是一个高性能、高吞…...
Android 自定义Adapter关键函数getView性能最优使用
文章目录 1、自定义Adapter关键函数getView()标准写法2、布局文件list_item_user.xml3、解释3、示例使用4、结果5、进一步优化和扩展5.1. **优化性能:ViewHolder模式**5.2. **处理多种类型的视图**5.3. **使用RecyclerView.Adapter** 6、RecyclerView使用示例7、结果…...
Linux服务上MySQL的启动、重启和关闭
Linux服务上MySQL的启动、重启和关闭 MySQL是一种广泛使用的开源关系型数据库管理系统,常用于各种规模的应用程序中。在Linux服务器上管理MySQL服务是一个基本的运维任务。本文将详细介绍如何在Linux系统上启动、重启和关闭MySQL服务,涵盖不同Linux发行…...
ctfshow web入门 嵌入式 bash cpp pwn
kali转bash shell方法 方便我们本地 bash脚本教程 下面这个代码是bash脚本 #!/bin/bashOIFS"$IFS"IFS"," //表示逗号为字段分隔符set $QUERY_STRING //将参数传入数组Args($QUERY_STRING)IFS"$OIFS" //恢复原始IFS值if [ "$…...
【ONE·Git || 基本用法入门】
总言 主要内容:主要介绍Git中常用的指令。 PS:多人协作与企业开发模型使用,此部分内容不作博文总结。 文章目录 总言1、初识Git1.1、版本控制器1.2、git安装 2、基本操作2.1、Git本地仓库2.1.1、创建Git本地仓库&…...
【运维项目经历|021】Spark大数据分析平台建设项目
目录 项目名称 项目背景 项目目标 项目成果 我的角色与职责 我主要完成的工作内容 本次项目涉及的技术 本次项目遇到的问题与解决方法 本次项目中可能被面试官问到的问题 问题1:项目周期多久? 问题2:服务器部署架构方式及数量和配置…...
装机数台,依旧还会心念i5-12600KF的性能和性价比优势:
近几个月的时间中, 装机差不多4台电脑,由于工作需要,计划年中再增添一台。 目前市场上英特尔CPU促销非常火爆,第12代、第13代以及第14代的产品在年中有适当的优惠。 年中也是装机的旺季,各种相关配件也相对便宜一些。…...
Docker-----emqx部署
emqx通过Docker容器化部署流程 1.创建持久化挂载目录 mkdir -p /home/emqx/etc ------挂载emqx的配置文件目录 mkdir -p /home/emqx/data ------挂载emqx的存储目录 mkdir -p /home/emqx/log ------挂载emqx的日志目录 [root home]# mkdir -p /home/emqx/etc [root home]# mkd…...
三数之和-力扣
这道题在使用哈希表来做时,做的很吃力,对重复的去除很费劲。 首先是对i的去重,不能使用nums[i] nums[i] 这样的条件去判断,这会遗漏掉类似[-1, -1 , 2]这样的解其次是对j的去重, 对j的去重是为了防止类似[-4, 2, 2, …...
2024 五月份国内外CTF 散装re 部分wp
cr3CTF warmup 附件拖入ida main函数无法反汇编,仔细看,有花指令,jnz实际上必定跳转。有非常多处,可以写脚本patch程序去掉花指令,只要匹配指令,再获取跳转地址,nop掉中间的代码就行。但…...
[猫头虎分享21天微信小程序基础入门教程]第21天:小程序的社交分享与消息推送
[猫头虎分享21天微信小程序基础入门教程]第21天:小程序的社交分享与消息推送 第21天:小程序的社交分享与消息推送 📲 自我介绍 大家好,我是猫头虎,一名全栈软件工程师。今天我们继续微信小程序的学习,重…...
aop整理
一、aop基础知识 Spring AOP 详细深入讲解代码示例 二、spring/spring boot/spring cloud中出现的注解/类与概念的对应 Aspect: 标注当前MyAspect是一个切面类,–》对应切面的概念,在切面类中有用Before等注解修饰的方法作为advice,也有用…...
Sublime Text 基础教程(个人总结)
Sublime Text 是一款广受欢迎的代码编辑器,以其简洁的界面和强大的功能而著称。它支持多种编程语言,具有高效的代码编辑和管理功能。本教程将详细介绍如何使用 Sublime Text,从安装到高级使用技巧,帮助你充分利用这款工具。 目录…...
线程安全 - 笔记
1 程序a调用c.so,程序b也调用c.so c.so加载两次吗? 在这种情况下,通常 c.so 不会被加载两次。 当一个程序调用一个共享对象文件(.so)时,操作系统的动态链接器将该共享对象映射到进程的虚拟内存空间中。后续由不同程序或者同一个程序调用相同的共享对象,都不会导致共享…...
分支机构多,如何确保文件跨域传输安全可控?
随着企业全球化发展,分支机构的分布越来越广泛,跨域文件传输需求也随之增加。然而,跨域文件传输面临的数据安全和传输效率问题,使得构建一个安全、可控的文件交换系统成为迫切需求。FileLink跨网文件交换系统通过综合的技术手段和…...
长安链使用Golang编写智能合约教程(二)
长安链2.3.0的go合约虚拟机和2.3.0以下的不兼容,编译的方式也有差异,所以在ide上做了区分。 教程三会写一些,其他比较常用SDK方法的解释和使用方法 教程一:(长安链2.1.的版本的智能合约) 教程三ÿ…...
铭豹扩展坞 USB转网口 突然无法识别解决方法
当 USB 转网口扩展坞在一台笔记本上无法识别,但在其他电脑上正常工作时,问题通常出在笔记本自身或其与扩展坞的兼容性上。以下是系统化的定位思路和排查步骤,帮助你快速找到故障原因: 背景: 一个M-pard(铭豹)扩展坞的网卡突然无法识别了,扩展出来的三个USB接口正常。…...
Cesium1.95中高性能加载1500个点
一、基本方式: 图标使用.png比.svg性能要好 <template><div id"cesiumContainer"></div><div class"toolbar"><button id"resetButton">重新生成点</button><span id"countDisplay&qu…...
线程同步:确保多线程程序的安全与高效!
全文目录: 开篇语前序前言第一部分:线程同步的概念与问题1.1 线程同步的概念1.2 线程同步的问题1.3 线程同步的解决方案 第二部分:synchronized关键字的使用2.1 使用 synchronized修饰方法2.2 使用 synchronized修饰代码块 第三部分ÿ…...
DAY 47
三、通道注意力 3.1 通道注意力的定义 # 新增:通道注意力模块(SE模块) class ChannelAttention(nn.Module):"""通道注意力模块(Squeeze-and-Excitation)"""def __init__(self, in_channels, reduction_rat…...
解决本地部署 SmolVLM2 大语言模型运行 flash-attn 报错
出现的问题 安装 flash-attn 会一直卡在 build 那一步或者运行报错 解决办法 是因为你安装的 flash-attn 版本没有对应上,所以报错,到 https://github.com/Dao-AILab/flash-attention/releases 下载对应版本,cu、torch、cp 的版本一定要对…...
成都鼎讯硬核科技!雷达目标与干扰模拟器,以卓越性能制胜电磁频谱战
在现代战争中,电磁频谱已成为继陆、海、空、天之后的 “第五维战场”,雷达作为电磁频谱领域的关键装备,其干扰与抗干扰能力的较量,直接影响着战争的胜负走向。由成都鼎讯科技匠心打造的雷达目标与干扰模拟器,凭借数字射…...
Rapidio门铃消息FIFO溢出机制
关于RapidIO门铃消息FIFO的溢出机制及其与中断抖动的关系,以下是深入解析: 门铃FIFO溢出的本质 在RapidIO系统中,门铃消息FIFO是硬件控制器内部的缓冲区,用于临时存储接收到的门铃消息(Doorbell Message)。…...
听写流程自动化实践,轻量级教育辅助
随着智能教育工具的发展,越来越多的传统学习方式正在被数字化、自动化所优化。听写作为语文、英语等学科中重要的基础训练形式,也迎来了更高效的解决方案。 这是一款轻量但功能强大的听写辅助工具。它是基于本地词库与可选在线语音引擎构建,…...
人机融合智能 | “人智交互”跨学科新领域
本文系统地提出基于“以人为中心AI(HCAI)”理念的人-人工智能交互(人智交互)这一跨学科新领域及框架,定义人智交互领域的理念、基本理论和关键问题、方法、开发流程和参与团队等,阐述提出人智交互新领域的意义。然后,提出人智交互研究的三种新范式取向以及它们的意义。最后,总结…...
Spring Security 认证流程——补充
一、认证流程概述 Spring Security 的认证流程基于 过滤器链(Filter Chain),核心组件包括 UsernamePasswordAuthenticationFilter、AuthenticationManager、UserDetailsService 等。整个流程可分为以下步骤: 用户提交登录请求拦…...
