React受控绑定

ops/2024/9/24 8:43:24/

受控绑定

概念:使用React组件的状态(useState)控制表单的状态
简单理解为双向绑定
在这里插入图片描述

function App(){const [value, setValue] = useState('')return (<input type="text" value={value} onChange={e => setValue(e.target.value)}/>)
}

非受控绑定

概念:通过获取DOM的方式获取表单的输入数据,就是获取dom对象

  1. 使用useRef创建 ref 对象,并与 JSX 绑定
    const inputRef = useRef(null),通过ref属性绑定
  2. 在DOM可用时,通过 inputRef.current 拿到 DOM 对象
    inputRef.current
function App(){const inputRef = useRef(null)const onChange = ()=>{console.log(inputRef.current.value)}return (<input type="text" ref={inputRef}onChange={onChange}/>)
}

http://www.ppmy.cn/ops/23236.html

相关文章

模块三:二分——LCR. 173.点名

文章目录 题目描述算法原理暴力查找二分查找 代码实现暴力查找二分&#xff1a;CJava 题目描述 题目链接&#xff1a;LCR. 173.点名 关于这道题中&#xff0c;时间复杂度为 O(N) 的解法有很多种&#xff0c;⽽且也是⽐较好想的&#xff0c;这⾥就不再赘述。本题只讲解⼀个最优…

MyBatis中默认的别名(简化 “XML映射文件中的类型引用“)

MyBatis中&#xff0c;"默认的别名" 是为了简化 "XML映射文件中的类型引用" 而设计的&#xff0c;这些别名是 MyBatis 自动为 Java 类型提供的简短名称&#xff0c;使得在配置和映射文件中&#xff0c;不需要使用完整的类名。MyBatis默认别名系统中&#x…

利用GaussDB的可观测性能力构建故障模型

D-SMART高斯专版已经开发了几个月了&#xff0c;目前主要技术问题都已经解决&#xff0c;也能够初步看到大概的面貌了。有朋友问我&#xff0c;GaussDB不已经有了TPOPS了&#xff0c;为什么你们还要开发D-SMART高斯专版呢&#xff1f; 实际上TPOPS和D-SMART虽然都可以用于Gaus…

SpringBoot+layuimini实现左侧菜单动态展示

layuimini左侧菜单动态显示 首先我们看一下layuimini的原有菜单显示格式 {"homeInfo": {"title": "首页","href": "page/welcome-2.html?t2"},"logoInfo": {"title": "LAYUI MINI","…

IntelliJ IDEA - Lombok supports: OpenJDK javac, ECJ

问题描述 java: You arent using a compiler supported by lombok, so lombok will not work and has been disabled.Your processor is: com.sun.proxy.$Proxy26Lombok supports: OpenJDK javac, ECJ 解决方案 在 IDEA 设置中 File -> Settings 中找到配置如下&#xff1…

03-JAVA设计模式-状态模式

状态模式 什么是状态模式 Java中的状态模式&#xff08;State Pattern&#xff09;是一种行为型设计模式&#xff0c;主要用于解决系统中复杂对象的状态转换以及不同状态下行为的封装问题。状态模式允许一个对象在其内部状态改变时改变它的行为&#xff0c;使得对象看起来似乎…

.NET 高级开发人员面试常见问题及解答

当面试.NET高级开发人员时&#xff0c;面试官通常会围绕技术深度、问题解决能力、项目经验以及编程理念等方面提出问题。以下是20个常见的面试问题及其详细解答&#xff1a; 问题&#xff1a;请简述ASP.NET MVC的工作原理&#xff1f; 解答&#xff1a;ASP.NET MVC是一个基于MV…

华为校招机试 - 满二叉搜索树查找(20240424)

在线OJ测试 题目详情 - 满二叉搜索树查找 - HydroOJ 题目描述 给定 (2^n) - 1 个不同的整数(1 ≤ n ≤ 10,n 为整数),构建一棵平衡满二叉搜索树。 二叉搜索树定义如下: 节点的左子树只包含小于当前节点的数节点的右子树只包含大于当前节点的数所有左子树和右子树自身必…