输入框点击选择
<van-field
readonly
clickable
:value="startdt"
placeholder="起始时间"
@click="clickStart"
/>
<van-field
readonly
clickable
:value="enddt"
placeholder="结束时间"
@click="clickEnd"
/>
<!-- 开始时间控件 -->
<van-popup v-model="showStart" position="bottom">
<van-datetime-picker
v-model="currentDate"
type="date"
:min-date="minStartDate"
:max-date="maxStartDate"
@confirm="confirmStart"
@cancel="showStart = false"
/>
</van-popup>
<van-popup v-model="showEnd" position="bottom">
<van-datetime-picker
v-model="currentDate1"
type="date"
:min-date="minEndDate"
:max-date="maxEndDate"
@confirm="confirmEnd"
@cancel="showEnd = false"
/>
</van-popup>
// 开始时间不得晚于结束时间,从选择范围上控制
clickStart(){
if(this.enddt){
this.maxStartDate = new Date(Date.parse(this.enddt.replace(/-/g, "/")));
}
this.showStart = true
},
// 结束时间不得早于开始时间,从选择范围上控制
clickEnd(){
if(this.startdt){
this.minEndDate = new Date(Date.parse(this.startdt.replace(/-/g, "/")));
} // 有无这段计算也不改变择结束时间的弹出层总是慢一点!
this.showEnd = true // 把这句放最前没有改变!
},