지식 정리 📝

Mui DatePicker 키보드 Event PreventDefault 하기

엄성준 2024. 1. 12. 09:07

 

관리자 기능 중에 Mui DatePicker를 이용해서 날짜를 선택하는 부분이 있었는데

 

이 때 허무맹랑한 날짜(1242-12-12)를 키보드로 입력한 이후에 new Date()로 오늘 날짜를 입력시키는 기능이 정상 작동하지 않았습니다. 

 

또한 화폐정보를 가져올 때 키보드 입력을 필요로 할만큼 큰 범위를 갖고있다고 생각하지 않았기에 키보드 입력자체를 막기로 결정했습니다.

 

DatePicker 속성에 아래의 코드를 적용하시면입력을 막을 수 있습니다.

 

<DatePicker
	slotProps={{
	field: {
	readOnly: true,
		},
	}}
/>