element 日期选择器选择限制,elementui日期选择器 怎么只能让它选择今天之前
在日常开发中，我们会遇到一些限制日期范围选择的情况。本文详细介绍了ElementUI日期选择器时间选择范围限制的实现。用示例代码详细介绍，有兴趣的可以看看。
目录
单输入框场景1:设置和选择今天和今天之后的日期场景2:设置和选择今天和今天之前的日期场景3:设置和选择今天和今天之后的日期(不能选择今天的时间)两个输入框场景1:限制结束日期不能晚于开始日期Elementui是一个基于vue2.x的ui框架，官方文档也非常详细。下面是对element-ui日期插件的补充。
在正式文档中，picker-options属性用于限制可以选择的日期。下面举几个例子补充一下。
单个输入框的
组件代码：
El-日期选择器
垂直模型=值1
type=date
Placeholder=选择日期
:picker-options=pickerOptions0
/El-日期选择器
情景1: 设置选择今天以及今天之后的日期
data (){
返回{
pickerOptions0: {
禁用日期(时间){
return time . gettime()date . now()-8.64 E7；
}
},
}
}
情景2: 设置选择今天以及今天以前的日期
data (){
返回{
pickerOptions0: {
禁用日期(时间){
return time . gettime()date . now()-8.64 E6
}
},
}
}
情景3: 设置选择今天之后的日期（不能选择当天时间）
data (){
返回{
pickerOptions0: {
禁用日期(时间){
return time . gettime()lt；date . now()；
}
},
}
}
4:设置并选择今天之前的日期(不能选择今天)。
data (){
返回{
pickerOptions0: {
禁用日期(时间){
return time . gettime()date . now()；
}
},
}
}
场景5:设置并选择三个月前到今天的日期。
data (){
返回{
pickerOptions0: {
禁用日期(时间){
let curDate=(新日期())。getTime()；
设三=90 * 24 * 3600 * 1000；
让三个月=凝固-三；
return time . gettime()date . now() time . gettime()three months；
}
},
}
}
两个输入框
组件代码
El-日期选择器
垂直模型=值1
type=date
Placeholder=开始日期
:picker-options=pickerOptions0
/El-日期选择器
El-日期选择器
v-model=value2
type=date
Placeholder=结束日期
:picker-options=pickerOptions1
/El-日期选择器
情景1: 限制结束日期不能大于开始日期
data(){
返回{
pickerOptions0: {
禁用日期：(时间)={
if (this.value2！=) {
return time . gettime()date . now() time . gettime()this . value 2；
}否则{
return time . gettime()date . now()；
}
}
},
建议1: {
禁用日期：(时间)={
return time . gettime()this . value 1 time . gettime()date . now()；
}
},
}
}
对于选择范围内的日期筛选(type=daterange )，类似于单个输入框的情况，直接用参数time进行判断。
关于ElementUI日期选择器的时间选择范围限制的实现，本文到此为止。有关要素日期选择器范围限制的更多信息，请搜索我们以前的文章或继续浏览下面的相关文章。希望大家以后能多多支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。