Can I put a conditional here in the value?

December 31, 2021

I wanted to have the initial datepicker to get the date of today of which I can already do, at this point, selected2Date still does not exist. Then, I want to check in the value if selected2 was true and instead of displaying the date of today, it will display the date of selected2Date.

 const [selected2, setSelected2Date] = useState(new Date());

The code if selected2Date is still empty.

                          <MuiPickersUtilsProvider utils={DateFnsUtils}>
                                  <DatePicker
                                    format="MM/dd/yyyy"
                                    value={selected2}
                                    onChange={setSelected2Date}
                                    fullWidth
                                  />
                                </MuiPickersUtilsProvider>

The code if selected2Date is not empty. Can I put a conditional here in the value?

 <MuiPickersUtilsProvider utils={DateFnsUtils}>
                                      <DatePicker
                                        format="MM/dd/yyyy"
                                        value={user.choices?.selected2}
                                        onChange={setSelected2}
                                        fullWidth
                                      />
                                    </MuiPickersUtilsProvider>

>Solution :

If value exist in user.choices.selected2 then get from the user.choices.selected2 otherwise get from the selected2 !

try below code.

<MuiPickersUtilsProvider utils={DateFnsUtils}>
  <DatePicker
    format="MM/dd/yyyy"
    value={user.choices.selected2 ? user.choices.selected2 : selected2}
    onChange={setSelected2}
    fullWidth
  />
</MuiPickersUtilsProvider>