el-date-picker限制选择的时间范围

el-date-picker限制选择的时间范围_第1张图片

 限制选择今天之前的时间,并且只能选择一天                

data() {
    return {

        pickerMinDate: '',
      pickerOptions: {
        onPick: (pick) => {
          this.pickerMinDate = pick; //获取当前选择日期
        },
        disabledDate: (date) => {
          const timeStamp = 24 * 60 * 60 * 1000; //1天的时间戳
          const { minDate, maxDate } = this.pickerMinDate;
          if (date.getTime() > Date.now()) {
            return true;
          } else if (minDate && !maxDate) {
            // 日期范围控制在365天内
            const tamp = Math.abs(minDate.valueOf() - date.valueOf());
            const customTimeStamp = timeStamp * 1; //自定义天数
            if (tamp > customTimeStamp) {
              return true;
            }
          }
        },
      },

    }
}

只能选择今天往后365天

 data() {
    return {
      valueDate: "",
      pickDate: "", //存储日期
      pickerOptions: {
        onPick: (pick) => {
          this.pickDate = pick; //获取当前选择日期
        },
        disabledDate: (date) => {
          const timeStamp = 24 * 60 * 60 * 1000; //一天的时间戳
          const { minDate, maxDate } = this.pickDate;
          if (date.getTime() < Date.now() - timeStamp) {
            //选择今天及以后的日期(如果不需要从今天开始,只需要控制范围,这个判断去掉即可)
            return true;
          } else if (minDate && !maxDate) {
            // 日期范围控制在365天内
            const tamp = Math.abs(minDate.valueOf() - date.valueOf());
            const customTimeStamp = timeStamp * 365; //自定义天数
            if (tamp > customTimeStamp) {
              return true;
            }
          }
        },
      },
    };
  },

你可能感兴趣的:(vue项目中常用操作,后台管理系统,vue.js,elementui,javascript)