I have a component that receive date from the backend as a string in dd/MM/yyyy format. I pass this date to my MaterialUI datepicker component, but it converts it into MM/dd/yyyy , is there a way i can control this conversion, rather than have a dummy variable to perform the tranformation
function MainForm3() {
const initialValues = {dob: '12/09/2020'}
return (<Formik initialValues={initialValues}>
{ formik => {
return (
<>
<myDatePicker name={"dob"} label={"Date of birth"} />
</>
)}}
</Formik >)}
function myDatePicker(props: any) {
const [field] = useField(props);
return (
<MuiPickersUtilsProvider utils={DateFnsUtils} >
<KeyboardDatePicker
fullWidth
InputProps={}
label={label}
placeholder={label}
{...field}
variant="inline"
inputVariant="outlined"
format="dd/MM/yyyy"
autoOk={true}
/>
</MuiPickersUtilsProvider>
)}
The on intial load the date in the text field shows it in MM/dd/yyyy format. WHen i click on the picker and and select the date it shows correctly in dd/MM/yyyy format as i have specified the same format on the format attribute.
How do i control the date format of the date that is loaded initially into the picker