[react] react中什么是受控组件？

表单元素的value/checked值与state绑定，同时表单元素的onChange可以动态的改变对应的state的值，即数据的变更可以更新视图，用户操作视图的更新也可以触发state数据的更新.

import React from 'react';
class FormDemo extends React.Component {state = {username: '',password: ''}handleChange = event => {const { name, value } = event.target;this.setState({[name]: value,});}onSubmit = () => {const { username, password } = this.state;console.log({username,password,})}render () {const { username, password } = this.state;return (<div className="form"><p><span>用户名:</span><input value={username} name="username" onChange={this.handleChange} /></p><p><span>密码:</span><input value={password} name="password" onChange={this.handleChange} /></p><button onClick={this.onSubmit}>登录</button></div>)}
}
export default FormDemo;

个人简介

我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，
但坚持一定很酷。欢迎大家一起讨论

主目录

与歌谣一起通关前端面试题

[react] react中什么是受控组件？相关推荐

【React】知识点归纳：受控组件与非受控组件区别
React: 受控组件与非受控组件区别受控组件示范代码: 原理图: 非受控组件示范代码: 结论受控组件在HTML中,标签<input>.<textarea>.< ...
如何在React Native中使用文本输入组件？
You know, an app becomes more authentic and professional when there is the interaction between the a ...
react中使用非受控组件获取表单元素的值
class Hello extends React.Component{constructor(){super() 利用react提供的React.createRef()this.ref=React. ...
前端学习（3230）：React中的非受控组件
react native中有关日期的组件DatePicker 示例
1.用node加载react-native-datepicker包 npm install react-native-datepicker 2.直接上代码 import React, { PureCo ...
android 高德地图 3d,在React Native中使用高德地图组件react-native-amap3d
react-native 高德地图组件,使用最新 3D SDK,支持 Android + iOS,受react-native-maps启发,提供功能丰富且易用的接口. node 主要功能:react ...
【已解决】在react+ts中 atnd 用 upload 组件报错Failed to execute ‘readAsArrayBuffer,param 1 is notof type Blob
今天在公司做 excel 导入文件的时候发现每次上传都会报这个错误: Uncaught TypeError: Failed to execute 'readAsArrayBuffer' on 'Fil ...
React中受控组件和非受控组件
受控组件在React中,每当表单的状态发生变化时,都会被写入到组件的state中,这种组件在React被称为受控组件.受控组件中,组件渲染的状态与它的value或者checked相对应.React通 ...
React中受控组件和非受控组件 1
一,受控组件 1.概念: 受控组件就是可以被 react 状态控制的组件在 react 中,Input textarea 等组件默认是非受控组件(输入框内部的值是用户控制,和 React 无关).但 ...

[react] react中什么是受控组件？

[react] react中什么是受控组件？

个人简介

主目录

[react] react中什么是受控组件？相关推荐

最新文章

热门文章