반응에서 입력 값을 얻는 방법

React에서 입력 값을 얻는 방법: 1. "inputChange(e){...}"와 같은 구문을 사용하여 이벤트 객체 정보를 통해 입력 값을 얻습니다. 2. 구문을 사용하여 ref를 사용하여 입력 값을 얻습니다. " this.setState({...})"와 같은 것입니다.

이 튜토리얼의 운영 환경: windows7 시스템, React17.0.1 버전, thinkpad t480 컴퓨터.

추천: "Basic JavaScript Tutorial"

react 입력 입력 상자의 값을 가져옵니다

첫 번째 방법: 이벤트 객체 정보를 통해

두 번째 방법: ref를 사용

이벤트를 통해 객체의 방법 information

<input onChange={(e)=>this.inputChange(e)}/>
<button onClick={()=>this.getInputValue} >获取input的值</button>
inputChange(e){
alert(e.target.value)
this.setState({
username:e.target.value
})
}
getInputValue(){
alert(this.state.username)
}

ref를 사용하는 방법

<input ref=&#39;username&#39; onChange={()=>this.inputChange()}/>
<button onClick={()=>this.getInputValue()} >获取input的值</button>
inputChange(){
//获取dom节点元素
//1.添加ref属性
//2.使用this.refs.username获取dom节点
let val=this.refs.username.value;
this.setState({
username:val
})
}
getInputValue(){
console.log(this.state.username)
}

ref를 사용하여 속성을 맞춤 설정하면 this.refs.property name.value를 통해 내용을 얻을 수 있습니다.

위 내용은 반응에서 입력 값을 얻는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!