UNIVE.US: Error, input에 값 입력 불가

input 태그에 value 속성을 추가하면 값이 입력되지 않는 에러가 발생했다. 해당 에러는 React에서만 발생하는 것 같다.
value 속성만이 값을 컨트롤할 수 있는 권한이 존재하기 때문에 사용자가 값을 변경할 수 없다. 따라서 onChange를 사용하여 값이 변경되도록 한다.

onChange를 사용하여 에러 해결

값이 변경되는 것을 반영하기 위해서 useState를 사용한다.

값이 변경될 수 있도록 handelMeetingTime이라는 함수를 만들어 준다. 해당 함수가 실행되면 setMeetingTime으로 meetingTime의 값이 변경된다.
이때, 변경될 값은 e.target.value이다. 현재 타겟팅 되어있는 값으로 변경하는 것이다.

onChange 이벤트를 사용하여 변화가 감지되면 handleMeetingTime 함수가 실행된다. 그리고 변경된 값이 input에 잘 나타나도록 value에 meetingTime을 넣어주면 된다.

참고
input 엘리먼트에 value 속성만 지정했을 때 값이 입력불가한 현상 해결방법