美文网首页
饿了吗中DatePicker日期选择器限制30天选择区间且不大于

饿了吗中DatePicker日期选择器限制30天选择区间且不大于

作者: 十一点后不在线 | 来源:发表于2021-04-01 10:27 被阅读0次

    在标签el-date-picker上添加:picker-options="pickerOptions"

    过滤方法:

    // 限制日期区间
          selectDate: '',
          pickerOptions: {
            onPick: ({ maxDate, minDate }) => {
              this.selectDate = minDate.getTime()
              if (maxDate) {
                this.selectDate = ''
              }
            },
            disabledDate: time => {
              //time.getTime()获取的是时间戳
              // 当前时间往前30天可选
              // return (
              // time.getTime() > Date.now() ||
              // time.getTime() < Date.now() - 30 * 24 * 60 * 60 * 1000
              // )
              // 只能选择30天的范围且不能大于当前日期
              if (this.selectDate !== '') {
                const one = 29 * 24 * 3600 * 1000
                const minTime = this.selectDate - one
                const maxTime = this.selectDate + one
                if (maxTime > Date.now()) {
                  return (
                    time.getTime() < minTime ||
                    time.getTime() >
                      new Date(new Date().toLocaleDateString()).getTime()
                  )
                } else {
                  return time.getTime() < minTime || time.getTime() > maxTime
                }
              } else {
                return (
                  time.getTime() >
                  new Date(new Date().toLocaleDateString()).getTime()
                )
              }
            }
          },
    

    相关文章

      网友评论

          本文标题:饿了吗中DatePicker日期选择器限制30天选择区间且不大于

          本文链接:https://www.haomeiwen.com/subject/snttkltx.html