6. input

import React, { Component } from 'react';

class PhoneForm extends Component {

state = {

name: ''

}

handleChange = (e) => {

this.setState({

name: e.target.value

})

}

render() {

return (

<form>

<input

placeholder="이름"

value={this.state.name}

onChange={this.handleChange}

/>

<div>{this.state.name}</div>

</form>

);

}

}

export default PhoneForm;

위에 미리 앞서 배운 setState에서 e.target.value로 값을 정해준뒤 input의 텍스트 값이 바뀔때마다 발생하는 이벤트이다.