処理[react]Input
4562 ワード
import React, { Component } from 'react';
class Form extends Component{
state = {
name:'',
phone: ''
}
handleChange = (e) => {
this.setState({
[e.target.name]: e.target.value
})
}
handleSubmit = (e) => {
e.preventDefault();
this.props.onCreate(this.state) // 부모에게 전달
render(){
return (
<form>
<input
placeholder="이름"
value={this.state.name}
onChange={this.handleChange}
/>
</form>
)}
}
export default Form;onChangeinputのテキスト値変更時に発生する海洋イベントです.e.target.value値により、inputから得られた現在のテキスト値を読み取ることができる.e.preventDefault()元の活動を防ぐための作業.this.props.onCreate(this.state)親に状態値を伝えるReference
この問題について(処理[react]Input), 我々は、より多くの情報をここで見つけました https://velog.io/@songbetter/React-Input-다루기テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol