el-date-picker 时间控件校验选择时间必须早于当前时间(带时分秒)

avatar
作者
筋斗云
阅读量: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";           }         }       }     },  

广告一刻

为您即时展示最新活动产品广告消息,让您随时掌握产品活动新动态!