Element UI 日期控件范围限制

1、设置开始时间不能大于结束时间

<el-date-picker type="date" placeholder="开始时间" v-model="startTime" :picker-options="pickerOptionsStart"></el-date-picker>
<el-date-picker type="date" placeholder="结束时间" v-model="endTime"   :picker-options="pickerOptionsEnd"  ></el-date-picker>

 

复制代码
data() {
  return {
    // 开始日期限制
    pickerOptionsStart: {
      disabledDate: (time) => {
        if (this.endTime) {
          return (
           time.getTime() > Date.now()-8.64e7 || time.getTime() >= new Date(this.endTime).getTime()
          );
        }
      }
    },
    // 结束日期限制
    pickerOptionsEnd: {
      disabledDate: (time) => {
        if (this.startTime) {
          return (
            time.getTime() >= Date.now()-8.64e6 || time.getTime() <= new Date(this.startTime).getTime()
          );
        }
      }
    }
  }
}
复制代码
// 主要是disabledDate的取值,返回值;
// 注意8.64e7 和 8.64e6的区别,后面的包括了当前的一天;
posted @   小阿飞ZJF  阅读(457)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· 单线程的Redis速度为什么快?
点击右上角即可分享
微信分享提示