minDate props overrides the null state value for Material-ui Datepicker

Question

I have a component where the minDate in the material-ui Datepicker is overriding the null value and making the minDate as selected value. Not only this it even triggers the onChange function for this. My component call (selectedDate's initial state is null) :

<DatePicker
disablePast
disableToolbar
autoOk
variant='static'
format='MMMM dd, yyyy'
value={selectedDate}
onChange={onChange}
minDate={startDate || new Date()}
/>

This trigger of onChange with this minDate value is causing the date to be set. I tried adding onClick event so that I can differentiate between user click and minDate forcing but that doesn't work. Even if there was a way to differentiate between user click and minDate forcing I can build on top of that. Please help.

Answer 1

Instead of calling your onChange function by reference. Try wrapping it an arrow function like so

onChange={(e) => {onChange(e)}

I am using e as the event object here. With this anonymous function it should only trigger on actual input change.