,elementui日期选择器范围
本文主要介绍了ElementUI时间选择器限制选择范围禁用数据的使用，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
关于结束时间不能大于开始时间的问题，在elementui里我们用官方提供的禁用日期选项来解决。
HTML:给选择器加上：选取器-选项属性
//开始时间
El-date-picker v-model= start date /El-date-picker
//截止时间
El-date-picker v-model= end date :picker-options= end date opt /El-date-picker
数据：
我这里就简略写下关键的。
data() {
返回{
startDate: null，
结束日期：空，
结束日期选项：{
禁用数据：(时间)={
返回时间。gettime()this。开始日期；
}
}
}
}
以上是单个选择框的，如果是日期范围或日期时间范围的话：
El-date-picker v-model= value 1 type= date range
:picker-options=pickerOptions
/El-日期选择器
data() {
返回{
值： ,
建议2: {
禁用日期：(时间)={
返回时间。gettime()新日期(2017，11，30) 时间。gettime()新日期(2017，11，11)；//注意是不是
}
}
};
}
PS：element 时间选择器，disabledDate同时限制多个条件
埃尔-日期选择器
v-model=listQuery.allDate
type=daterange
范围分隔符=-
取消链接-面板
值格式=yyyy-MM-dd
start-placeholder=开始日期
end-placeholder=结束日期
class=data_piccker
style=width:240px
:picker-options=pickerOptions
/El-日期选择器
建议：{
onPick: ({ maxDate，minDate })={
这个。picker mindate=mindate。gettime()
if (maxDate) {
this.pickerMinDate=
}
},
禁用日期：(时间)={
常数年=365 * 24 * 3600 * 1000
//一年前的时间戳
让去年=今年
//已经选择一个日期则……
if (this.pickerMinDate！==) {
第31天=31 * 24 * 3600 * 1000
//选中的日期前推31天，的时间戳
让数据范围b=这。提货人日期-第31天
//选中的日期后推31天
让数据范围a=这。采摘者最晚第31天
//如果后推的日期早于今天，则设置为今日
if (datarangea new Date()) {
数据范围a=新日期()
}
//使用或可以同时限制多个条件
返回时间。gettime()数据范围b time。gettime()数据范围a
}
//未选择日期，默认状态当天之前不可选，一年之前不可取
返回时间。gettime()日期。现在() 时间。gettime()去年
},
},
到此这篇关于ElementUI时间选择器限制选择范围禁用数据的使用的文章就介绍到这了，更多相关元素u禁用数据内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。