Element UI中日期选择器级联 任务7040

473 阅读1分钟

首都机场集团项目 任务7040
需求: 开始日期始终小于或等于结束日期

(首都机场集团项目: vue代码分为=> template : 页面展示内容 、 created初始化 、 返回结果 、 自定义方法 )
1.绑定一个change事件,当相关元素发生变化时会触发该事件(用于监听开始时间,以保证在开始时间会随着结束日期的变化而变化)
2.pickerOptions为elementUI提供的属性,控制时日期禁用,此处用于控制结束日期,使得结束日期小于开始日期时的部分保持禁用状态。 1.在返回结果中 通过“Element UI”提供的属性设置日期的禁用 =>禁用日期通过 disabledDate 设置 设置禁用的时间范围:当前输入的时间,换算单位后(毫秒)一天之前全部禁用

开始时间选择的监听:设置完结束时间的禁用之后就是开始时间的监听 以确保结束时间设置完成时开始时间会自动发生变更,符合需求 之前绑定事件中调用的方法在此处定义,定义形参。让开始时间等于一个参数,设置完结束时间时(用户输入),再设置开始时间结束后,将此时的开始时间和结束时间进行比较, 如果开始时间比结束时间大,则 让结束时间等于开始时间。 当开始时间大于当前结束时间的时候,主动对结束时间进行赋值,调整二者使其保持一致。