重点：组件的picker-options属性。
demo代码：
<el-form-item label="开始日期" prop="start">
<el-date-picker
v-model="formData.start"
type="date"
value-format="yyyy-MM-dd"
:picker-options="begin"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
<el-form-item label="结束日期" prop="end">
<el-date-picker
v-model="formData.end"
type="date"
value-format="yyyy-MM-dd"
:picker-options="process"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
computed:{
//日期时间选择控制，开始时间必须小于结束时间
begin () {
const _this = this
return {
disabledDate (time) {
if (_this.formData.end) { // 如果结束时间不为空，则只能小于结束时间
return new Date(_this.formData.end).getTime() < time.getTime()
} else { // 开始时间不选时，结束时间小于等于当天
return time.getTime() > Date.now()
}
}
},
process () {
const _this= this
return {
disabledDate (time) {
if (_this.formData.start) { // 如果开始时间不为空，结束时间大于开始时间
return new Date(_this.formData.start).getTime() > time.getTime()
} else { // 开始时间不选时，结束时间小于等于当天
return time.getTime() > Date.now()
}
}
}
},
}
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/66322.html
