elementui日期选择器设置开始时间不能大于结束时间

 

iView 日期时间选择器设置开始时间至结束时间限制 http://www.sharedblog.cn/post/204.html

 

elementui 日期选择器设置 开始时间不能大于结束时间，结束时间不能小于开始时间

简单容易，就不做详细解释了，复制粘贴，修改对应参数名即可

   
   

     
     

      
      

     
     
     
     

      
      
    
       
       <el-date-picker
      
      
     
     

     
     

      
      

     
     
     
     

      
      
      
       
       v-model=
       
       "startTime"
      
      
     
     

     
     

      
      

     
     
     
     

      
      
      
       
       size=
       
       "small"
      
      
     
     

     
     

      
      

     
     
     
     

      
      
      
       
       type=
       
       "date"
      
      
     
     

     
     

      
      

     
     
     
     

      
      
      
       
       placeholder=
       
       "开始时间"
      
      
     
     

     
     

      
      

     
     
     
     

      
      
      
       
       :picker-options=
       
       "pickerOptionsStart"
      
      
     
     

     
     

      
      

     
     
     
     

      
      

       
           >
      
      
     
     

     
     

      
      

     
     
     
     

      
      
    
       
       </el-date-picker>
      
      
     
     

     
     

      
      

     
     
     
     

      
      
    
       
       <el-date-picker
      
      
     
     

     
     

      
      

     
     
     
     

      
      
      
       
       size=
       
       "small"
      
      
     
     

     
     

      
      

     
     
     
     

      
      
      
       
       v-model=
       
       "endTime"
      
      
     
     

     
     

      
      

     
     
     
     

      
      
      
       
       type=
       
       "date"
      
      
     
     

     
     

      
      

     
     
     
     

      
      
      
       
       placeholder=
       
       "结束时间"
      
      
     
     

     
     

      
      

     
     
     
     

      
      
      
       
       :picker-options=
       
       "pickerOptionsEnd"
      
      
     
     

     
     

      
      

     
     
     
     

      
      

       
           >
      
      
     
     
   
   

   
   

     
     

      
      

     
     
     
     

      
      
  
       
       data(
       
       ) {
      
      
     
     

     
     

      
      

     
     
     
     

      
      
    
       
       return {
      
      
     
     

     
     

      
      

     
     
     
     

      
      
      
       
       // 开始结束日期限制
      
      
     
     

     
     

      
      

     
     
     
     

      
      
      
       
       pickerOptionsStart: {
      
      
     
     

     
     

      
      

     
     
     
     

      
      
        
       
       disabledDate: 
       
       (time) => {
      
      
     
     

     
     

      
      

     
     
     
     

      
      
          
       
       if (
       
       this.
       
       endTime) {
      
      
     
     

     
     

      
      

     
     
     
     

      
      
            
       
       return (
      
      
     
     

     
     

      
      

     
     
     
     

      
      

       
                     time.
       
       getTime() >= 
       
       new 
       
       Date(
       
       this.
       
       endTime).
       
       getTime()
      
      
     
     

     
     

      
      

     
     
     
     

      
      

       
                   );
      
      
     
     

     
     

      
      

     
     
     
     

      
      

       
                 }
      
      
     
     

     
     

      
      

     
     
     
     

      
      

       
               }
      
      
     
     

     
     

      
      

     
     
     
     

      
      

       
             },
      
      
     
     

     
     

      
      

     
     
     
     

      
      
      
       
       // 结束日期限制
      
      
     
     

     
     

      
      

     
     
     
     

      
      
      
       
       pickerOptionsEnd: {
      
      
     
     

     
     

      
      

     
     
     
     

      
      
        
       
       disabledDate: 
       
       (time) => {
      
      
     
     

     
     

      
      

     
     
     
     

      
      
          
       
       if (
       
       this.
       
       startTime) {
      
      
     
     

     
     

      
      

     
     
     
     

      
      
            
       
       return (
      
      
     
     

     
     

      
      

     
     
     
     

      
      

       
                     time.
       
       getTime() <= 
       
       new 
       
       Date(
       
       this.
       
       startTime).
       
       getTime()
      
      
     
     

     
     

      
      

     
     
     
     

      
      

       
                   );
      
      
     
     

     
     

      
      

     
     
     
     

      
      

       
                 }
      
      
     
     

     
     

      
      

     
     
     
     

      
      

       
               }
      
      
     
     

     
     

      
      

     
     
     
     

      
      

       
             }
      
      
     
     

     
     

      
      

     
     
     
     

      
      

       
           }
      
      
     
     

     
     

      
      

     
     
     
     

      
      

       
         }
      
      
     
     
   
   

【推荐】前端软件下载 http://iqzhan.com/category-23.html

原文地址 http://sharedblog.cn/post/211.html

前端博客 http://sharedblog.cn

转载原文地址 https://blog.csdn.net/tianpeng1996/article/details/111383391