vue 限制开始日期不能大于结束日期，结束日期不能小于开始日期

最新推荐文章于 2024-04-26 09:56:11 发布

Luminary7

最新推荐文章于 2024-04-26 09:56:11 发布

阅读量1k

点赞数 2

分类专栏： vue 文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/Luminary7/article/details/127886338

版权

vue 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

页面：pickerOptionsStart和pickerOptionsEnd方法

 <el-form-item
                label="执行期限"
                class="text_align_left executionPeriod"
              >
                <el-date-picker
                  v-model="declarationParams.dateStart"
                  type="date"
                  size="small"
                  class="widthFiftyPer"
                  :picker-options="pickerOptionsStart"
                  placeholder="选择日期"
                >
                </el-date-picker>
                <span class="ex_title">至</span>
                <el-date-picker
                  v-model="declarationParams.dateEnd"
                  type="date"
                  size="small"
                  :picker-options="pickerOptionsEnd"
                  class="widthFiftyPer"
                  placeholder="选择日期"
                >
                </el-date-picker>
              </el-form-item>

data()里添加判断

pickerOptionsStart: {
        disabledDate: (time) => {
          if (this.declarationParams.dateEnd) {
            return (
              time.getTime() >
              new Date(this.declarationParams.dateEnd).getTime()
            );
          }
        },
      },
      pickerOptionsEnd: {
        disabledDate: (time) => {
          if (this.declarationParams.dateStart) {
            return (
              time.getTime() <
              new Date(this.declarationParams.dateStart).getTime() +
                1 -
                86400000
            );
          }
        },
      },