element-plus DatePicker 日期选择器动态调整可选范围

483 阅读1分钟

需求:

搜索条件中时间不能跨月。

功能细化:

1.用户打开日期选择器第一次点击日期后,限制日期选择器的可选范围为当月;

2.用户选择完成后,日期选择器的可选范围重置;

具体实现

1.声明参数selectMonth标识第一次点击日期的月份;

2.通过disabled-date属性来修改禁用日期范围,根据selectMonth字段动态返回布尔值;

3.根据calendar-change事件判断当前用户点击日期为第几步,修改selectMonth字段

代码