【第2章】2.5 收集表单数据(受控组件、非受控组件)

本文深入探讨了React中的表单管理,重点讲解了受控组件和非受控组件的区别。受控组件通过状态管理输入数据,而非受控组件则直接从DOM获取。通过一个登录表单案例,展示了两种组件的实现方式,帮助读者更好地理解和应用这两种技术。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

收集表单数据

1.理解

包含表单的组件分类

  • a.受控组件 【随着你输入的东西,维护保存到状态里,用的时候从状态里直接去,类似vue的双向数据绑定】
  • b.非受控组件【输入类的dom(如input框,单选多选框),现用现取】

2.通过一个小案例更好的理解

  • 需求: 定义一个包含表单的组件 输入用户名密码后, 点击登录提示输入信息
  • 在这里插入图片描述

案例(非受控组件写法)在这里插入图片描述

案例(受控组件写法)
在这里插入图片描述
愿有所收获,喜欢的点赞关注 持续更新中…

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值