在Material UI DatePicker中聚焦特定日期

Question

如何在React Material UI的DatePicker组件中突出显示初始日期到明天或特定日期?

节选自我的代码

<DatePicker
name="dueDate"
label="Due Date"
disablePast
/>

Answer 1

设置DatePicker的initialFocusedDateprop

下面的代码将初始聚焦日期设置为明天。

import moment from 'moment'
... 
<DatePicker
name="dueDate"
label="Due Date"
initialFocusedDate={moment().add(1, 'days')}
disablePast
/>

您可以将initialFocusedDate设置为您想要的任何日期，当您打开DatePicker时，它会聚焦。

Answer 2

对于MUI v5，如果有人想将选定的日期移动到前一个月或前一年或前10年，propdefaultCalendarMonth将起作用

<DatePicker
name="dueDate"
label="Due Date"
defaultCalendarMonth={DateTime.now().minus({ years: 10 })}
disablePast
/>