需求
用户名自动获取 onChange用户状态发生改变 就获取值 就是时时获取值 使用onChange
点击按钮 获取密码
只要绑定了点击事件 就可以获取值 通过
let usercont=event.target.value;//获取用户的值
ref获取值的另外一种用法
密码: <input type="password" ref={this.Myrefs}></input>
Myrefs = React.createRef();创建一个承装ref的容器 Myrefs一致
let pwd = this.Myrefs.current
consolr.log(pwd)
import React,{ Component } from "react"
export default class Login extends Component {
state={
username:""
}
changecon = (event) => { event是某个被绑定的事件 可以使用它代替ref
let usercont=event.target.value;获取用户的值
.setState({
username: usercont
})
console.log(.state.username)
}
Myrefs = React.createRef();创建一个承装ref的容器 Myrefs一致
subcon=(event)=>{
event.preventDefault()
let pwd = .Myrefs.current
alert(pwd.value)
}
用户名是受控组件 :会自动维护state
密码框是 非受控组件 :不会自动维护state
render() {
return (
<div>
<form>
{/* onChange用户状态发生改变 就获取值 就是时时获取值 使用onChange */}
用户名:<input type="text" onChange={this.changecon}></input>
密码: <input type="password" ref={this.Myrefs}></input>
<button onClick={this.subcon}>按钮</button>
</form>
</div>
)
}
}
原文地址:https://www.cnblogs.com/IwishIcould
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。