zoukankan      html  css  js  c++  java
  • elementui限制开始日期和结束日期

    项目需求:开始日期和结束日期 禁用当前日期之前的日期。同时结束日期 禁用开始日期之前的日期

        <div class='startTime'>
            开始时间:<el-date-picker v-model="value1" type="date" @change="changeStartTime" :clearable="false"
              placeholder="选择日期" :picker-options="startDateLimit">
            </el-date-picker>
            <span class="important">*</span>
          </div>
          <!-- 结束时间 -->
          <div class="endTime">
            结束时间:<el-date-picker v-model="value2" :picker-options="endDateLimit" type="date" :clearable="false" @change="changeEndTime" placeholder="选择日期">
            </el-date-picker>
            <span class="important">*</span>
          </div>
    
    vm = new Vue({
      el: "#app",
      data: function () {
        return {
          value1: "", //开始时间
          value2: "", //结束时间
          startDateLimit: {
            disabledDate: (time) => {
              // if (this.value2 != "") {
              //   return time.getTime() > new Date(this.value2).getTime();
              // }else{
                return time.getTime() < Date.now() - 8.64e7;//禁用当前日期之前的时间;如果没有后面的-8.64e6就是不可以选择今天的
              // }
            }
          },
          endDateLimit: {
            disabledDate: (time) => {
              if(this.value1!= ""){
                return time.getTime() < new Date(this.value1).getTime()//禁用开始日期之前的日期
              }
              return time.getTime() < Date.now() - 8.64e7;; //减去一天的时间代表可以选择同一天;
            }
          },
        }
      },
    
    
    更多使用方法链接如下:
    https://blog.csdn.net/qq_33769914/article/details/83856268
    https://www.cnblogs.com/YuKiee/p/9651240.html
    
  • 相关阅读:
    微博回调接口
    vue获取微博授权URL
    生成微博授权url接口
    微博账号注册
    电脑程式直接打开文件
    关于 transparent rgba display:none; opacity visiblity 关于em
    定位及部分属性
    盒模型以及部分小笔记
    htm基础知识,css的链入以及标签分类。
    JS函数01
  • 原文地址:https://www.cnblogs.com/FormerWhite/p/11772647.html
Copyright © 2011-2022 走看看