react hooks浅谈

一.useEffect

useEffect是hooks中的生命周期函数
1.只要页面更新就触发回调:
useEffect(() => {
// 执行逻辑
})
2.只运行一次(组件挂载和卸载时执行),第二个参数传空数组[]:
useEffect(() => {
//
},[])
3. 条件执行,第二个参数传值,可以是多个数据源的数组,当依赖的数据源发生改变时,执行回调:
useEffect(() => {
//
},[source1,source2…])

二.useState

useState用来更新数据状态
类组件是用的setState({})

三.useRef, useImperativeHandle,forwardRef

1.首先我们先用React.useRef创建一个ref
const reRef = React.useRef(null);
2. forwardRef是允许了 父组件向子组件传递一个ref,父组件才可以获得子组件的方法和实例元素
3. useImperativeHandle 是在子组件中接收这个ref 可以暴露子组件的特定属性或方法给父组件

例子:
父组件:
import React, { useEffect, useState, useRef } from ‘react’;
const reRef =useRef(null);
reRef.current.fn();

注意:
这个reRef也可以传到其他的文件中,在其他的文件里也可以调用或者更新子组件的属性和方法的

子组件:
function Parent(props, ref) {
const [visible, setVisible] = useState);

useImperativeHandle(ref,()=>({
fn: ()=>{
console.log(‘这是传的第一个方法’);
},
fn2: ()=>{
console.log(‘这是传的第二个方法’);
},
setVisible,//这是传的一个属性值
})

}

export default forwardRef(Parent);

注:当需要复杂的传值的属性和方法调用时 这么用可以
但一般单纯的回归方法调用就能解决就不用这样写了
比如
父组件:
<Parent onClose={(num)={
console.log(881,num)

}}>

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

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

相关文章

Flask重定向后无效果前端无跳转无反应问题

在网上搜了一下并没有什么好的解决方案&#xff0c;有的话也只是告诉你如何修改代码&#xff0c;并没有讲明白其中的原理以及导致问题的核心&#xff0c;因此特意去了解了一下HTTP的规范找到了答案 问题说明 问题出现的流程大致都是前端发送Ajax请求给后端&#xff0c;进行一些…

【愚公系列】2023年12月 HarmonyOS教学课程 037-ArkUI事件(焦点事件)

&#x1f3c6; 作者简介&#xff0c;愚公搬代码 &#x1f3c6;《头衔》&#xff1a;华为云特约编辑&#xff0c;华为云云享专家&#xff0c;华为开发者专家&#xff0c;华为产品云测专家&#xff0c;CSDN博客专家&#xff0c;CSDN商业化专家&#xff0c;阿里云专家博主&#xf…

测试理论知识三:测试用例、测试策略

1.测试用例 完全的测试是不可能的&#xff0c;对任何程序的测试必定是不完全的&#xff0c;那么&#xff0c;最显然的测试策略就是努力使测试尽可能完全。 进行测试前&#xff0c;推荐先使用黑盒测试的方法设计测试用例&#xff0c;然后使用白盒测试方法来补充的测试用例。 2…

2023“楚怡杯”湖南省赛“信息安全管理与评估“--内存取证(高职组)

2023“楚怡杯”湖南省“信息安全管理与评估”(高职组)任务书 2023“楚怡杯”湖南省“信息安全管理与评估”(高职组)任务书第一阶段竞赛项目试题第二阶段竞赛项目试题第三部分 内存取证:需要环境私聊博主:2023“楚怡杯”湖南省“信息安全管理与评估”(高职组)任务书 第…

Flink电商实时数仓(三)

DIM层代码流程图 维度层的重点和难点在于实时电商数仓需要的维度信息一般是动态的变化的&#xff0c;并且由于实时数仓一般需要一直运行&#xff0c;无法使用常规的配置文件重启加载方式来修改需要读取的ODS层数据&#xff0c;因此需要通过Flink-cdc实时监控MySql中的维度数据…

相互独立的Gamma分布变量之和的分布

两个变量之和的情况 设随机变量相互独立&#xff0c;并且服从参数为的分布&#xff0c;记作&#xff1b;服从参数为的分布&#xff0c;记作&#xff0c;和的概率密度分别为&#xff1a; 其中 其中 那么随机变量服从参数为的分布&#xff0c;记作。 推广到n个变量之和的情况 …

余弦距离和余弦相似度的区别

余弦相似度&#xff0c;就是计算两个向量间的夹角的余弦值&#xff1a;cosθ &#xff0c;取值范围 [-1,1] 。值越大&#xff0c;相似度越高 余弦距离就是用1减去这个获得的余弦相似度&#xff1a;1-cosθ &#xff0c;取值范围 [0,2] 。值越大&#xff0c;距离越远。 余弦距离…

为什么销售的强刺激政策不管用?

销售人员是联系企业生产与市场的纽带&#xff0c;是一个企业经济效益的直接创造者&#xff0c;他们对企业的贡献举足轻重&#xff0c;对销售人员的激励是否有效关系到整个企业的营销体系稳定与业绩提升。 因此&#xff0c;激励销售人员成为所有老总共同的愿望&#xff0c;甚至…

云原生消息流系统 Apache Pulsar 在腾讯云的大规模生产实践

导语 由 InfoQ 主办的 Qcon 全球软件开发者大会北京站上周已精彩落幕&#xff0c;腾讯云中间件团队的冉小龙参与了《云原生机构设计与音视频技术应用》专题&#xff0c;带来了以《云原生消息流系统 Apache Pulsar 在腾讯云的大规模生产实践》为主题的精彩演讲&#xff0c;在本…

进阶之路:高级Spring整合技术解析

Spring整合 1.1 Spring整合Mybatis思路分析1.1.1 环境准备步骤1:准备数据库表步骤2:创建项目导入jar包步骤3:根据表创建模型类步骤4:创建Dao接口步骤5:创建Service接口和实现类步骤6:添加jdbc.properties文件步骤7:添加Mybatis核心配置文件步骤8:编写应用程序步骤9:运行程序 1.…

挑选知识付费平台不再迷茫:掌握这些技巧,轻松找到适合自己的平台!

明理信息科技知识付费平台 在当今的知识付费市场中&#xff0c;用户面临的选择越来越多&#xff0c;如何从众多知识付费平台中正确选择属于自己的平台呢&#xff1f;下面&#xff0c;我们将为您介绍明理信息科技知识付费平台相比同行的优势&#xff0c;帮助您做出明智的选择。…

Dubbo面试题及答案,持续更新

在准备Dubbo相关的面试题时&#xff0c;我发现网络上的资源往往缺乏深度和全面性。为了帮助广大Java程序员更好地准备面试&#xff0c;我花费了大量时间进行研究和整理&#xff0c;形成了这套Dubbo面试题大全。 这套题库不仅包含了一系列经典的Dubbo面试题及其详尽答案&#x…

雅思考试笔试还是机试,哪个更好,为什么?

想要参加或者即将参加雅思考试的同学们&#xff0c;你们知道雅思笔试和机试的有哪些相似点和不同点吗&#xff1f;下面由E趣少儿英语&#xff08;LUEnglish&#xff09;为您具体分析。 雅思纸笔考试与雅思机考&#xff1a;两者之间的相似之处 两个版本的雅思考试&#xff08;…

concat_ws()和college_list()配合=>实现多行转一行

concat_ws()&#xff1a; concat_ws()是“with separator”的缩写&#xff0c;它是一个用于连接字符串的函数。ws代表“with separator”&#xff0c;即带有分隔符。这个函数的作用是将多个字符串连接起来&#xff0c;并在它们之间插入指定的分隔符。语法&#xff1a;concat_ws…

最新版android stuido加上namespace

每个 Android 模块都有一个命名空间&#xff0c;此命名空间用作其生成的 命名空间由模块的 build.gradle 文件中的 namespace 属性定义&#xff0c;如以下代码段所示。namespace 最初会设为您在创建项目时选择的软件包名称。 Kotlin Groovy android {namespace "com.ex…

2023 英特尔On技术创新大会直播 | 边云协同加速 AI 解决方案商业化落地

目录 前言边云协同时代背景边缘人工智能边缘挑战英特尔边云协同的创新成果最后 前言 最近观看了英特尔On技术创新大会直播&#xff0c;学到了挺多知识&#xff0c;其中对英特尔高级首席 AI 工程张宇博士讲解的边云协同加速 AI 解决方案商业化落地特别感兴趣。张宇博士讲解了英…

【正点原子STM32连载】第十七章 通用定时器中断实验 摘自【正点原子】APM32E103最小系统板使用指南

第十七章 通用定时器中断实验 本章介绍APM32E103通用定时器的使用&#xff0c;通用定时器相较于基本定时器&#xff0c;拥有输入捕获和输出比较等功能&#xff0c;这些功能可以用来测量脉冲宽度、频率和占空比&#xff0c;并且可以产生并输出波形等。通过本章的学习&#xff0…

开源堡垒机JumpServer结合内网穿透实现远程访问

开源堡垒机JumpServer结合内网穿透实现远程访问 前言1. 安装Jump server2. 本地访问jump server3. 安装 cpolar内网穿透软件4. 配置Jump server公网访问地址5. 公网远程访问Jump server6. 固定Jump server公网地址 前言 JumpServer 是广受欢迎的开源堡垒机&#xff0c;是符合 …

网络安全:网络安全的技术趋势与发展

1.背景介绍 网络安全是现代信息化时代的重要问题之一&#xff0c;它涉及到计算机网络的安全性、数据的完整性、隐私保护等方面。随着互联网的不断发展&#xff0c;网络安全问题也日益复杂化。本文将从多个方面进行探讨&#xff0c;以帮助读者更好地理解网络安全的技术趋势与发…

spring依赖注入对象类型属性----外部bean的引入(bean和bean之间的引入)

文章目录 注入普通属性的方式1、set方法注入2、构造器&#xff08;构造方法&#xff09;注入 总结&#xff1a;注入对象类型属性 注入普通属性的方式 1、set方法注入 2、构造器&#xff08;构造方法&#xff09;注入 总结&#xff1a; set方法注入和构造器方法的注入&#…