zoukankan      html  css  js  c++  java
  • vue问题五:element ui组件的开始时间结束时间验证

    <el-date-picker  v-model="seach.before" type="date" placeholder="开始时间"  value-format="yyyy-MM-dd" class="wida" :picker-options="pickerBeginDateBefore"  @change="changeTime">
    </el-date-picker>
        <span class="zhi"></span>
    <el-date-picker   v-model="seach.after" type="date" placeholder="结束时间"value-format="yyyy-MM-dd" class="wida" :picker-options="pickerBeginDateAfter">
    </el-date-picker>
    template中
    seach:{
      before:'',
      after:'',
    },
      // 开始时间不大于结束时间
            // 开始时间
            pickerBeginDateBefore: {
              disabledDate: (time) => {
                let beginDateVal = this.seach.after;
                if (beginDateVal) {
                  return time.getTime() > beginDateVal;
                }
              }
            },
            // 结束时间
            pickerBeginDateAfter: {
              disabledDate: (time) => {
                let beginDateVal = this.seach.before;
                if (beginDateVal) {
                  return time.getTime() < beginDateVal;
                }
              }
            },
    return 中
    //选择开始时间,清空结束时间
          changeTime(date){
            // this.seach.before="";
            // console.log(this.seach.before)
            this.pickerBeginDateAfter={
              disabledDate(time) {  //开始时间-结束时间
                return (time.getTime() < new Date(date).getTime());
              }
            }
          },
    methods 中
  • 相关阅读:
    Chrony时间同步
    使用cfssl生成自签证书
    Docker运行时资源限制
    Docker的OverlayFS存储驱动
    Docker文件挂载总结
    Docker配置文件deamon.json详解
    Docker网络模式详解
    Dcoker命令使用详解
    Docker架构分解
    《数据采集和分析平台》笔记
  • 原文地址:https://www.cnblogs.com/M-miao/p/9838727.html
Copyright © 2011-2022 走看看