elementUI⽇期时间选择器el-date-picker开始时间与结束时间约束主要思路：
el-date-picker组件需要 :picker-options属性，属性值为data,data的数据来⾃于methods中的⽅法。
##template代码
<el-form-item label="开始时间" prop="startTime" >
<el-date-picker v-model="form.startTime"  format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss" clearable
:picker-options="startDatePicker" :disabled="dialogStatus=='view'" type="datetime"  :placeholder="dialogStatus=='view'?'':'请输⼊订阅开始时间'"></el-date-picker>
js当前日期加一天</el-form-item>
<el-form-item label="结束时间" prop="endTime">
<el-date-picker v-model="dTime"  format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss" clearable
:
picker-options="endDatePicker"  :disabled="dialogStatus=='view'" type="datetime"  :placeholder="dialogStatus=='view'?'':'请输⼊订阅结束时间'"></el-date-picker>
</el-form-item>
##data数据
data() {
return {
startDatePicker: this.beginDate(),
endDatePicker: this.processDate(),
  }
}
##methods⽅法
beginDate(){
const self = this
return {
disabledDate(time){
if (dTime) {  //如果结束时间不为空，则⼩于结束时间
return new Date(dTime).getTime() < Time()
} else {
// Time() > w()//开始时间不选时，结束时间最⼤值⼩于等于当天
}
}
}
},
processDate() {
const  self = this
return {
disabledDate(time) {
if (self.form.startTime) {  //如果开始时间不为空，则结束时间⼤于开始时间
return new Date(self.form.startTime).getTime() > Time()
} else {
// Time() > w()//开始时间不选时，结束时间最⼤值⼩于等于当天
}
}
}
}
附加：
只可以选择今天以及今天以后的时间：
pickerOptions0: {
disabledDate(time) {
Time() < w() - 8.64e7;//8.64e7=1000*60*60*24⼀天
}
},
# 说明。添加多个时间限制，使⽤||⽽不是&&，因为这⾥返回的是disabledDate
processDate() {
const  self = this
return {
disabledDate(time) {
if (self.form.beginTime) {  //如果开始时间不为空，则结束时间⼤于开始时间，且⼤于当前时间
return new Date(self.form.beginTime).getTime() > Time() || Time() < w() - 1000*3600*24      } else {
Time() < w() - 1000*3600*24//开始时间不选时，结束时间最⼤值⼤于等于当天
}
}
}
},

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。