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
    
  • 相关阅读:
    iphone精简教程
    自己搭建云盘 – 简单的PHP网盘程序
    内存泄漏(I)
    App 基本图片配置(I)
    Git 工作环境配置
    MVC(I)
    ReactNative APP基本框架搭建 基于 React Navigation
    UI绘制原理及卡顿 掉帧原因
    ES6中Json、String、Map、Object之间的转换
    Invariant Violation: requireNativeComponent: "RNCWKWebView" was not found in the UIManager.
  • 原文地址:https://www.cnblogs.com/FormerWhite/p/11772647.html
Copyright © 2011-2022 走看看