需求:日历选择结束时间大于等于开始时间限制,这里我的需求就是合同开始日期小于合同结束日期。
如果选择了开始日期那么结束日期只能是大于等于开始日期
如果选择了结束日期那么开始日期只能是小于等于结束日期
看过需求直接上代码
两个触发事件分别是合同开始时间和合同结束时间的触发事件,通过事件触发格式化后赋值到绑定的 :value值并关闭日历弹窗
然后在vue中data数据体里面声明两个变量来决定合同开始时间和合同结束时间的最大选取范围和最小选取范围。
然后通过日历的open触发事件来赋值合同开始时间和合同结束时间变量的选取时间范围
通过replace函数将时间例如:(2022-2-2转化为2022,2,2)赋值给合同开始时间和合同结束时间变量的选取时间范围。
注意:此操作对IOS有兼容问题!Vant官网底部有给出。
搜索很多Vant时间限制都是针对时间的,但是没有针对日历日期限制的。希望这篇文章能帮到大家!