React日历指定月份:react-multi-date-picker默认当前月问题求助
解决react-multi-date-picker指定起始/结束月份的问题
要指定日历的起始和结束月份,可通过以下关键配置实现:
1. 初始化日历默认显示的起始月份
修改useState的初始值,将DateObject指定为你想要的起始月份(注意月份是0基,1月对应0,12月对应11):
const [calanderDate, setCalanderDate] = useState(new DateObject({ year: 2024, month: 0 })) // 以2024年1月作为起始展示月份
2. 通过minDate和maxDate限定月份范围
给Calendar组件添加minDate和maxDate属性,明确允许的月份边界,配合numberOfMonths控制显示的月份总数:
<Calendar disableMonthPicker disableYearPicker buttons={false} numberOfMonths={15} onChange={(e) => setCalanderDate(e)} value={calanderDate} fullscreen={false} multiple // 设置允许的最早月份 minDate={new DateObject({ year: 2024, month: 0 })} // 设置允许的最晚月份(这里是起始月+14个月,对应15个月的展示范围) maxDate={new DateObject({ year: 2025, month: 2 })} />
补充说明
- 若仅需要让日历默认从指定月份开始展示,无需限制可选日期,只需修改
useState的初始DateObject即可,minDate和maxDate可省略。 DateObject的参数支持year、month、day,按需设置即可,未指定的参数会默认取当前时间对应值。
内容的提问来源于stack exchange,提问作者deep shah
相关产品推荐
相关产品推荐

