React之内置的高阶组件

React之内置的高阶组件

React内置了一些高阶组件,以便对一些组件做特殊处理,从而提高代码性能。例如React.memoReact.forwardRef

注意:高阶组件不是Reacts视图组件

  • 什么是高阶组件

高阶组件本质是高阶函数。高阶组件接收一个组件作为参数,并返回处理后的组件

1、React.memo

作用: 在函数组件中,父组件状态更新,默认会更新子组件。为了避免父组件引起的子组件的更新,使用memo包裹子组件导出

import { memo } from 'react'export default memo(子组件)

memo:不会影响子组件自身的更新,只会优化父组件更新带来的副作用

注意: 类组件中使用的是 React.PureComponent

import { PureComponent } from 'react'class 子组件 extends PureComponent {render() {return (<div>测试</div>)}
}

2、React.forwardRef

React18, 函数组件没有组件实例,本身是无法使用ref获取子组件实例的,需要使用高阶组件 forwardRef,包裹导出的子组件。从而在父组件调用子函数组件的时候可以使用ref

具体使用可见:
React.forwardRef的具体使用

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/10462.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

QListWidget设置QWidget作为QListWidgetItem

1、实现QListWidget按照N像素进行滑动&#xff1b; 2、实现自定义QWidget作为QListWidgetItem&#xff1b; 代码实现&#xff1a; from PyQt5.QtWidgets import QWidget, QLabel, QVBoxLayout, QHBoxLayout, QTextEdit, QListWidget, QListWidgetItem, QScrollArea from PyQt5…

GNN的一篇入门 :A Gentle Introduction to Graph Neural Networks

原文链接 A Gentle Introduction to Graph Neural Networks (distill.pub)https://distill.pub/2021/gnn-intro/ 内容简介&#xff1a;本文是“A Gentle Introduction to Graph Neural Networks”的阅读笔记&#xff0c;因为第一次接触GNN&#xff0c;很多深奥的概念不懂&…

使用TensorFlow和VGG-19模型实现艺术风格迁移:一步一步打造你的数字艺术世界

在当下的AI领域,神经风格迁移是最富有创新性和艺术性的技术之一。这项技术可以将一种图像的风格迁移至另一种图像,创造出让人眼前一亮的视觉效果。这种转变所展现的技术之美,让我们深感人工智能所带来的可能性。本文将带领大家一步步通过TensorFlow和VGG-19模型实现风格迁移…

C++容器——list的模拟实现

目录 一.list的基本结构 二. 接下来就是对list类构造函数的设计了&#xff1a; 三.链表数据的增加&#xff1a; 四.接下来就是迭代器的创建了&#xff1a; 四.简单函数的实现&#xff1a; 五.构造与析构 六.拷贝构造和赋值重载 传统写法: 现代写法&#xff1a; 七.迭…

docker启动mysql时的两个报错

目录 1.Error response from daemon: driver failed programming external connectivity on endpoint mysql 2.Error response from daemon: Conflict. The container name "/mysql" is already in use by container 1.Error response from daemon: driver failed …

【预处理】——获取可变参数宏的参数数量

文章目录 功能说明实现... 的作用__VA_ARGS__ 的作用##__VA_ARGS__ 的作用 解析COUNT_ARGS(2, 4, 5)没有参数 COUNT_ARGS()参数大于 22 个 示例 功能说明 用于获取可变参数宏实际传递了多少个参数。 COUNT_ARGS(1, 2, 3)&#xff0c;填入了 3 个参数&#xff0c;返回值就是 3…

C#中未能找到为main方法指定的XXX.Program怎么解决

有时在修改项目名称后&#xff0c;报错未能找到为main方法指定的XXX.Program 解决办法&#xff1a; 点击进入项目属性&#xff0c;将启动对象设置为空或者你要指定的XXX.Program&#xff08;改名后的&#xff09;

akka 简单使用

由于AKka的核心是Actor&#xff0c;而Actor是按照Actor模型进行实现的&#xff0c;所以在使用Akka之前&#xff0c;有必要弄清楚什么是Actor模型。 Actor模型最早是1973年Carl Hewitt、Peter Bishop和Richard Seiger的论文中出现的&#xff0c;受物理学中的广义相对论(general…

服务器数据恢复-误操作导致存储VDisk丢失的数据恢复案例

服务器数据恢复环境&#xff1a; IBM某型号存储&#xff1b; Solaris操作系统&#xff0c;部署Oracle数据库。 服务器故障&#xff1a; 重建MDisk导致对应的存储池中的VDisk丢失&#xff0c;导致Solaris操作系统中的Oracle数据库无法使用。 服务器数据恢复过程&#xff1a; 1、…

理解Android中不同的Context

作者&#xff1a;两日的blog Context是什么&#xff0c;有什么用 在Android开发中&#xff0c;Context是一个抽象类&#xff0c;它是Android应用程序环境的一部分。它提供了访问应用程序资源和执行各种操作的接口。可以说&#xff0c;Context是Android应用程序与系统环境进行交…

面向对象——步入JavaScript高级阶段的敲门砖

目录 前言一、认识对象1.什么是对象2.对象的方法3.对象的遍历4.对象的深浅克隆 二、认识函数上下文1.函数的上下文规则 ★2.call和apply ★ 三、构造函数1.用new操作符调用函数2.类与实例3.构造函数和类" 四、原型和原型链1.prototype和原型链查找 ★2.在prototype上添加方…

Windows下安装Hadoop(手把手包成功安装)

Windows下安装Hadoop&#xff08;手把手包成功安装&#xff09; Windows下安装Hadoop&#xff08;手把手包成功安装&#xff09;一、环境准备1.1、查看是否安装了java环境 二、下载Hadoop的相关文件三、解压Hadoop安装包四、替换bin文件夹五、配置Hadoop环境变量六、检查环境变…

【数学建模】时间序列分析

文章目录 1. 条件2. 模型分类3. SPSS处理时间序列 1. 条件 1.使用于具有时间、数值两种要素 2.数据具有周期性可以使用时间序列分解 2. 模型分类 叠加模型【YTSCI】 序列的季节波动变化越来越大&#xff0c;反映变动之间的关系发生变化乘积序列【YTSC*I】 时间序列波动保持恒…

【多模态】16、DetCLIP | 构建超大词汇字典来进行开放世界目标检测

论文&#xff1a;DetCLIP: Dictionary-Enriched Visual-Concept Paralleled Pre-training for Open-world Detection 代码&#xff1a;无。。。 出处&#xff1a;NIPS2022 | 华为诺亚方舟 | 中山大学 | 香港科技大学 效果&#xff1a; 在 LVIS 的 1203 个类别上超越了 GLIP…

【树上乘法原理】ICPC Shanghai 2021 G, Edge Groups

http://oj.daimayuan.top/course/8/problem/400 题意&#xff1a; 思路&#xff1a; 求方案数&#xff0c;考虑组合数学 手摸一下样例发现&#xff0c;对于一棵子树&#xff0c;若边数为偶数&#xff0c;那么可以内部匹配&#xff0c;但是如果边数为奇数&#xff0c;那么就一…

嵌入式:QT Day2

一、继续完善登录框&#xff0c;当登陆成功时&#xff0c;关闭登陆页面&#xff0c;跳转到新的界面中 源码&#xff1a; widget.h #ifndef WIDGET_H #define WIDGET_H#include <QWidget> #include <QDebug> //用于打印输出 #include <QIcon> …

无涯教程-jQuery - jQuery.getScript( url, callback )方法函数

jQuery.getScript(url&#xff0c;[callback])方法使用HTTP GET请求加载并执行JavaScript文件。 该方法返回XMLHttpRequest对象。 jQuery.getScript( url, [callback] ) - 语法 $.getScript( url, [callback] ) 这是此方法使用的所有参数的描述- url - 包含请求…

mac 移动硬盘未正常退出,再次链接无法读取(显示)

&#xff08;1&#xff09;首先插入自己的硬盘&#xff0c;然后找到mac的磁盘工具 &#xff08;2&#xff09;打开磁盘工具&#xff0c;发现自己的磁盘分区在卸载状态&#xff1b;点击无法成功装载。 &#xff08;3&#xff09;打开终端&#xff0c;输入 diskutil list查看自…

VITE + VUE 全局环境变量使用相关知识

一. 全局环境变量配置及使用 配置&#xff1a; 创建.env和.env.development&#xff0c;.env.production等配置文件&#xff0c;.env.uat, .env.test及其它均可。变量要以大写的VITE_开头&#xff0c; 如VITE_APP_NAME 测试网站 使用&#xff1a; 在代码中 import.meta.env…

Redis应用(1)——生成全局唯一标识ID

1 概述 在实际项目中&#xff0c;根据不同的业务逻辑需要生成唯一的标识id &#xff0c;如购买商品生成的订单号。尽管这个标识id功能非常的简单&#xff0c;但是如果不能成功的生成唯一标识id&#xff0c;那将会影响后续的业务逻辑 。我们可以使用数据库去生成唯一标识id&…