Enter를 눌렀을 때 폼을 제출하도록 구현하는 다른 방법은 onKeyUp 이벤트에서 Enter를의 키코드인 13을 확인하는 것이다.

handleKeyUp(event) {
  if (event.keyCode == 13) return this.sendData()
}
render() {
  return <form onKeyUp={this.handleKeyUp}>
  ...
  </form>
}

 

sendData() 메서드는 클래스 또는 컴포넌트의 다른 곳에 구현되어 있다. 또한, this.sendData()가 정상으로 작동하려면 constructor()에서 이벤트 핸들러에 this 바인딩을 해주어야 한다.

정리하면 폼의 개별 요소뿐만 아니라 폼 요소에서 이벤트를 사용할 수 있다. 이제 폼 요소를 어떻게 정의하는지 살펴보자.