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

【React】获取DOM

1. 获取/操作dom的方式

  • 方式: 使用useRef钩子函数

2. 步骤

  1. 使用useRef创建ref对象,并与jsx绑定
  2. 在dom可用(指的是渲染完毕dom生成之后)时,通过inputRef.current拿到DOM对象
import { useRef } from "react"function App() {const inputRef = useRef(null)function showMsg() {console.log(inputRef)}return (<div className="App"><input ref={inputRef}></input><button onClick={showMsg}>click me</button></div>);
}export default App;

在这里插入图片描述

相关文章:

  • 2024.9.21 Python与C++的面试八股文整理,类与对象,内存规划,默认函数,虚函数,封装继承多态
  • 【C++前缀和 位运算 贪心 】2680. 最大或值|1912
  • OpenAi以及Dify结合生成Ai模型
  • 408算法题leetcode--第16天
  • 【LeetCode:2535. 数组元素和与数字和的绝对差 + 模拟】
  • 使用 Napkins.dev 将草图转换为应用程序
  • 内网穿透的应用-Windows系统安装SeaFile并实现远程访问本地共享文件资料详细教程
  • 亲身体验Llama 3.1:开源模型的部署与应用之旅
  • asp.net mvc core 路由约束,数据标记DataTokens
  • Angular面试题十
  • 什么是Node.js?
  • centos7系统安装宝塔面板
  • 亚信安全天穹5分钟勒索体检 免费试用今起上线
  • 5.10直方图均衡化
  • 依赖倒转原则(DIP)
  • interface和setter,getter
  • JavaScript 基本功--面试宝典
  • Javascript编码规范
  • learning koa2.x
  • LeetCode18.四数之和 JavaScript
  • Mybatis初体验
  • seaborn 安装成功 + ImportError: DLL load failed: 找不到指定的模块 问题解决
  • spring cloud gateway 源码解析(4)跨域问题处理
  • Swift 中的尾递归和蹦床
  • 大数据与云计算学习:数据分析(二)
  • 关于extract.autodesk.io的一些说明
  • 计算机在识别图像时“看到”了什么?
  • 精彩代码 vue.js
  • 前嗅ForeSpider教程:创建模板
  • 如何使用Mybatis第三方插件--PageHelper实现分页操作
  • 少走弯路,给Java 1~5 年程序员的建议
  • 使用SAX解析XML
  • 写代码的正确姿势
  • 3月7日云栖精选夜读 | RSA 2019安全大会:企业资产管理成行业新风向标,云上安全占绝对优势 ...
  • ​iOS实时查看App运行日志
  • ​LeetCode解法汇总518. 零钱兑换 II
  • #162 (Div. 2)
  • #设计模式#4.6 Flyweight(享元) 对象结构型模式
  • (14)目标检测_SSD训练代码基于pytorch搭建代码
  • (Charles)如何抓取手机http的报文
  • (k8s)Kubernetes本地存储接入
  • (ZT)北大教授朱青生给学生的一封信:大学,更是一个科学的保证
  • (二)linux使用docker容器运行mysql
  • (附源码)计算机毕业设计ssm电影分享网站
  • (蓝桥杯每日一题)平方末尾及补充(常用的字符串函数功能)
  • (三)centos7案例实战—vmware虚拟机硬盘挂载与卸载
  • (十三)Maven插件解析运行机制
  • (实测可用)(3)Git的使用——RT Thread Stdio添加的软件包,github与gitee冲突造成无法上传文件到gitee
  • (完整代码)R语言中利用SVM-RFE机器学习算法筛选关键因子
  • .bat批处理(六):替换字符串中匹配的子串
  • .net core 6 redis操作类
  • .NET MVC之AOP
  • .Net多线程Threading相关详解
  • [ 常用工具篇 ] POC-bomber 漏洞检测工具安装及使用详解
  • [2018/11/18] Java数据结构(2) 简单排序 冒泡排序 选择排序 插入排序