watch(start, v => {
if (end.value && end.value < v) end.value = addDays(v, 1);
});
// <input type="date" :min="start" />
用户把入住日期从 10 号改到 15 号,离店日期还停在 12 号,页面没有任何提示。点提交后接口回 400,提示离店不能早于入住,用户得自己回头看两个框。先别急着动参数,把报错原文和时间点记下来,顺序反了容易白折腾。
原因不复杂,两个日期各自绑定一个值,改动其一时没有重算另一个,也没有校验先后顺序。选择器只限制了单值范围,跨字段的约束没有落到任何一处。
「日期区间联动」排查到最后往往是很小的一处差异,前面那些复杂猜测可以先放一放。改动写完就同步给同事,下一个人踩同一个坑,成本还是你的。
处理上按这个顺序:开始日期变化后,若结束日期早于它,自动顺延一天并高亮提示;结束日期的 min 设为开始日期,在控件层面先挡一次;提交前再做跨字段校验,错误挂在结束日期上。
改完只确认一件事:把开始日期改到结束日期之后,结束日期自动顺延,提交不再报区间错误。
