[react] react中什么是非控组件?
生活随笔
收集整理的這篇文章主要介紹了
[react] react中什么是非控组件?
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
[react] react中什么是非控組件?
表單元素的value/checked值、onChange事件沒有和組件的state存在綁定關(guān)聯(lián)關(guān)系,如果需要獲取表單元素的值,需要使用ref獲取DOM,然后得到元素的值.demo如下:
import React from 'react'; class FormDemo extends React.Component {refUsername = React.createRef();refPassword = React.createRef();onSubmit = () => {const [username,password,] = [this.refUsername.current.value,this.refPassword.current.value,];console.log({username,password,})}render () {return (<div className="form"><p><span>用戶名:</span><input ref={this.refUsername} name="username" /></p><p><span>密碼:</span><input ref={this.refPassword} name="password" /></p><button onClick={this.onSubmit}>登錄</button></div>)} } export default FormDemo;?個人簡介
我是歌謠,歡迎和大家一起交流前后端知識。放棄很容易,
但堅持一定很酷。歡迎大家一起討論
主目錄
與歌謠一起通關(guān)前端面試題
總結(jié)
以上是生活随笔為你收集整理的[react] react中什么是非控组件?的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 手机淘宝客应用(服务端+客户端+数据库)
- 下一篇: 一行代码实现底部导航栏TabLayout