react) datePicker onChange문제 (클래스형 컴포넌트)

Question

안녕하세요.항상 함수형 컴포넌트만 사용하다가, 클래스형 컴포넌트를 이용해야만 하는 일이 있어서 다음과 같은 코드를 작성중입니다.질문에 필요한 부분만 남긴 코드입니다. (생략된 부분이 많습니다)// 클래스형 컴포넌트 class MySchedule extends Component { constructor(props) { super(props); this.state = { startDate: "", }; } // 생략 render() { let { events } = this.state; // 이벤트 클릭 시 수정 모달 const handleEventClick = (info) => { this.startDate = info.event.start; // 기존에 저장되어있는 날짜 잘 나옴 }; // 수정 버튼 클릭 시 const handleUpdate = () => { console.log(this.startDate); // 변경된 날짜값으로 안나옴 (기존에 저장되어있는 날짜로 나옴) } return (

{/* 수정 모달 */}

날짜 this.setState({startDate: date})} />

); } } export default MySchedule; (설명)화면에 event들이 존재하고, 하나의 event를 클릭(eventClick)하였을 때 handleEventClick 함수가 실행 되게끔 하였습니다.handleEventClick 함수의 info.event.start 는 event의 날짜를 나타내는 것으로, 문제 없이 잘 나옵니다.그러나, 부분에서 onChange부분이 문제인 것 같은데 아무리 봐도 무엇이 문제인지 잘 모르겠습니다.this.setState({startDate: date}를 이용하여 startDate에 datePicker에서 새로 선택된 날짜를 받아오게 작성하였고,이를 하단의 [수정]버튼을 클릭(handleUpdate)하여 this.StartDate값을 콘솔 창에 찍어보게 하였습니다.그러나 변경된 날짜 값으로 나오지 않고 기존에 저장되어있는 날짜로 나오며, 기존에 선택되어있는 날짜가 계속 체크 되어있습니다.이해 하시기 쉽게 그림으로 표현했습니다.도와주시면 정말 감사드립니다.

Hee Sung Son · Answer

onChange를 onSelect 으로 바꿔보셔요문서를보니 날짜클릭시 발생하는 이벤트라고 되어있네요

react) datePicker onChange문제 (클래스형 컴포넌트)

1개의 답변

#datepicker 목록