react通过ref获取函数子组件实例方法

在react16之后带来了hooks之后,确实方便了很多组件开发,也加快了函数式编程的速度,但是当你通过useRef获取子组件的时候,又恰好子组件是一个函数组件,那么将会报一个错误:报这个错误的主要原因是函数组件没有实例对象,所以你没办法通过ref获取子组件实例 

Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

所以它提示你是否使用 forwardRef 将子组件包裹一下:

包裹一下之后就不会报错了,而且也可以拿到子组件实例了:但是子组件实例上面啥都没有,是一个空对象?

这个时候还要在子组件上暴露出去几个函数,才可以让父组件拿到子组件实例上的函数:

  // 暴露出去的实例对象应该有哪些函数useImperativeHandle(ref, () => ({saveMd: () => {console.log("保存markdown内容");localStorage.setItem("notes", htmlString)}}))

这时候再看一下获取到的子组件实例:就有了子组件暴露出去的函数,就可以调用了

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

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

相关文章

数据通信——传输层(UDP)

引言 我们上网观看比赛的时候,一旦网络信号出现问题,那可就太难受了,这意味着卡顿的时间内,你会错过这段时间内的内容。这种特性要归功于UDP(User Datagram Protocol)用户数据报协议。 无连接性 一般的&am…

第十七课:利用 Setup Factory 制作 Qt 软件安装包

功能描述:详细介绍如何利用 Setup Factory 制作 Qt 软件安装包,从 Setup Factory 软件下载、安装,到如何利用 Setup Factory 制作软件安装包,手把手教你将 Qt 应用程序制作成具有安装向导的安装包。 一、Setup Factory 简介 Setu…

qt信号槽同步问题

目录 信号槽: 注意事项: 具体例子: 线程安全问题的例子: 信号槽: 在Qt编程中,信号(Signal)和槽(Slot)是一种用于在对象之间进行通信的机制。信号用于发出…

宇凡微Y51T合封射频芯片,集成433M芯片和MCU

宇凡微推出的Y51T芯片的设计理念很有趣,将MCU和射频芯片集成在一颗芯片内,从而实现高度的集成度和功能优势。这样的设计在某些应用中确实能够带来诸多优点: Y51T将51H MCU和Y4455 433MHz射频芯片融合在一颗芯片内,实现了高度集成的…

Python基础 - 构造函数

目录 基础构造函数 重写 钻石继承 super函数 基础构造函数 命名为_init_,在实例化对象之前会自动执行该函数 构造函数方便我们在实例化对象的时候实现个性化定制 class A():def __init__(self,x,y):self.x xself.y ydef add(self):return self.xself.yclass…

(纯c)数据结构之------>链表(详解)

目录 一. 链表的定义 1.链表的结构. 2.为啥要存在链表及链表的优势. 二. 无头单向链表的常用接口 1.头插\尾插 2.头删\尾删 3.销毁链表/打印链表 4.在pos位置后插入一个值 5.消除pos位置后的值 6.查找链表中的值并且返回它的地址 7.创建一个动态开辟的结点 三.顺序表与链表…

【深度学习】Pytorch训练过程中损失值出现NaN

项目场景 利用Pytorch框架,结合FEDformer开源代码(https://github.com/MAZiqing/FEDformer),将自己的数据集作为输入训练模型。 问题描述 训练过程中,发现打印出来的Train loss, Test loss, Test loss中&#xff0c…

性能调优篇 二、Jvm监控及诊断工具-命令行篇

目录 一、概述1、简单命令行工具 二、jps:查看正在运行的Java程序(掌握)1、是什么?2、测试3、基本语法 三、jstat:查看jvm统计信息(掌握)1、是什么?2、基本语法3、补充 四、jinfo&am…

MongoDB 双机热备那篇文章是 “毒”

开头还是介绍一下群,如果感兴趣polardb ,mongodb ,mysql ,postgresql ,redis ,Oracle ,Oceanbase 等有问题,有需求都可以加群群内有各大数据库行业大咖,CTO,可以解决你的问题。加群请加微信号 liuaustin3 (…

AI 浪潮下,W3AI 如何增强和激励 Web3 玩家研究和决策力?

更加个性化的 AI 服务是怎样的?近年来,不少主打 AI 服务的 Web3 初创项目开始兴起,凭借语音、文字、图像等全方位的用户数据跟踪和使用习惯定义,场景化的 AI Web3 产品开始围绕用户的工作、生活日常提供智能服务。这其中&#xff…

本质矩阵E推R和T

https://zhuanlan.zhihu.com/p/500798616 https://zhuanlan.zhihu.com/p/435306687

【MySQL系列】Select语句单表查询详解入门(SELECT,AS,模糊查询,运算符,逻辑运算符)

💐 🌸 🌷 🍀 🌹 🌻 🌺 🍁 🍃 🍂 🌿 🍄🍝 🍛 🍤 📃个人主页 :阿然成长日记 …

SCI论文创新思路

SCI论文创新思路 一、 创新的分类1、算法创新2、架构创新3、迁移创新4、思想创新5、方法创新6、组合创新 二、组合创新的必要性三、组合创新的流程四、组合创新举例1、组合创新公式2、生活中的例子3、关于CV的例子4、魔改的方法 一、 创新的分类 1、算法创新 比如提出CNN、LS…

【PHP面试题82】system和exec是用来做什么的?有什么区别

文章目录 🚀一、前言,PHP中system和exec命令的作用🚀二、system()函数🚀三、exec()函数🚀四、区别和应用场景🔎4.1 使用system()函数的应用场景🔎4.2 使用exec()函数的应用场景🔎4.3…

SpringCloud入门实战(十四)Sentinel微服务流量防卫兵简介

📝 学技术、更要掌握学习的方法,一起学习,让进步发生 👩🏻 作者:一只IT攻城狮 ,关注我,不迷路 。 💐学习建议:1、养成习惯,学习java的任何一个技术…

Linux线程篇(中)

有了之前对线程的初步了解我们学习了什么是线程,线程的原理及其控制。这篇文章将继续讲解关于线程的内容以及重要的知识点。 线程的优缺点: 线程的缺点 在这里我们来谈一谈线程健壮性: 首先我们先思考一个问题,如果一个线程出现…

【官方中文文档】Mybatis-Spring #目录

目录 此页面用于在GitHub上呈现索引。 NOTE: 由于链接目标是在使用maven-site-plugin转换为html的假设下指定的,因此在GitHub上的呈现中有一个锚点已损坏。 简介入门SqlSessionFactoryBean事务使用 SqlSession注入映射器Spring Boot使用 MyBatis APISpring Batch示…

Ubuntu22.04安装中文输入法►由踩坑到上岸版◄

Ubuntu22.04安装中文输入法►由踩坑到上岸版◄ 了解入坑上岸 更新一发:Gedit中文乱码问题的解决 为了方便回忆和记录甚至后面继续重装系统,我还是写一下以便将来用到或参考~ 了解 安装Ubuntu22.04(截至2023年08月26日11&#xff…

基于JavaFX的贪吃蛇小游戏

游戏背景介绍 贪吃蛇游戏是一款经典的小游戏,它的玩法很简单,就是控制蛇吃食物,每吃一个食物蛇的长度就会加一,直到蛇撞到墙壁或者撞到自己时游戏结束,最终的得分是蛇的长度减一。 JavaFX 用Java开发桌面端首选就是J…

shell脚本——循环语句、sed、函数、数组、免交互expect

目录 循环语句 for while 与 until sed 基本用法 sed脚本格式 函数 注意事项 定义函数和调用函数 脚本中函数的位置 查看函数 删除函数 函数返回值 函数的传参操作 使用函数文件 递归函数 数组 声明数组 数组切片 免交互expect 定义 基本命令 循环语句 …