阅读量:0
el-date-picker 时间控件校验选择时间必须遭早于当前时间(带时分秒),然后监控时间控件,当时间改变的时候,如果不是当天,那时间可以选择全天也就是00-24时,如果是当天,就是当前时间之前
html部分
<el-form-item label="注销时间" prop="logoutTime"> <el-date-picker v-model="formData.logoutTime" :placeholder="'请选择注销时间'" type="datetime" :picker-options="pickerOptions" style="width: 200px"> </el-date-picker> </el-form-item>
//js部分
data(){ pickerOptions: { disabledDate(time) { const date = new Date(); return time.getTime() > new Date().getTime(); // return time.getTime() > new Date().getTime() - 86400000;//这个不包含当天 }, selectableRange: (() => { let data = new Date(); let hour = data.getHours(); let minute = data.getMinutes(); let second = data.getSeconds(); return [`00:00:01 - ${hour}:${minute}:${second}`] })(), }, } //监听时间控件的改变值 watch: { 'formData.logoutTime':{ handler(newVal, oldVal) { //这里判断是不是今天 let newValDate= new Date(newVal)//转换成中国标准时间 if ( newValDate &&newValDate.getFullYear() == new Date().getFullYear() && newValDate.getMonth() == new Date().getMonth() && newValDate.getDate() == new Date().getDate() ) { //如果为今天,则限制当前时间后的时间不能选择。 let data = new Date(); let hour = data.getHours(); let minute = data.getMinutes(); let second = data.getSeconds(); this.pickerOptions.selectableRange = [`00:00:01 - ${hour}:${minute}:${second}`] }else{ //如果不是今天,则不用限制 this.pickerOptions.selectableRange = "00:00:00 - 23:59:00"; } } } },