官网对于picker-options的定义及参数:
实现:
实现开始日期结束日期的关键点在于,要以对方的选择日期为条件,防止报错,必须判断是否为空。
HTML
<el-form-item class="row_item_time" label="期限:" prop="contractStartTime">
<el-col :span="11">
<el-form-item prop="contractStartTime">
<el-date-picker :picker-options="pickerOptions0" value-format="yyyy-MM-dd HH:mm:ss" :disabled="mark==='look'" type="date" placeholder="选择日期" v-model="formData.contractStartTime" style="width: 50%;"></el-date-picker>
</el-form-item>
</el-col>
<el-col class="line" :span="2">——</el-col>
<el-col :span="11">
<el-form-item prop="contractEndTime">
<el-date-picker :picker-options="pickerOptions1" value-format="yyyy-MM-dd HH:mm:ss" :disabled="mark==='look'" type="date" placeholder="选择日期" v-model="formData.contractEndTime" style="width: 50%;"></el-date-picker>
</el-form-item>
</el-col>
</el-form-item>
data中的数据
<script>
export default{
data(){
return{
pickerOptions0: {
disabledDate: (time) => {
if (this.formData.contractEndTime != "") {
return time.getTime() > new Date(this.formData.contractEndTime).getTime();
}
}
},
pickerOptions1: {
disabledDate: (time) => {
if (this.formData.contractStartTime != "") {
return time.getTime() < new Date(this.formData.contractStartTime).getTime();
}
}
},
}
}
}
</script>
版权声明:本文为m0_47135993原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。