el-date-picker不能跨月/年/周/天

**版权声明：本文为CSDN博主「前端学狗」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。

原文链接：https://blog.csdn.net/weixin_44370837/article/details/122070299**

 <el-date-picker
    v-model="groupSearchTime"
    type="daterange"
    range-separator="至"
    start-placeholder="开始日期"
    end-placeholder="结束日期"
    value-format="yyyy-MM-dd"
    style="width: 482px;line-height: 24px"
    :picker-options="pickerOptions"
    @change="getSearchTime">
</el-date-picker>

data中的代码：通过pickerOptions字段来控制时间选择器组件的禁用与否，因此关键点就在于得到合法时间的前后时间

data() {
    return {
      groupSearchTime: [],
      choiceDate: '',
      pickerOptions: {
        onPick: ({ maxDate, minDate }) => {
          this.choiceDate = minDate.getTime()
          if (maxDate) {
            this.choiceDate = ''
          }
        },
        disabledDate: (time) => {
          const self = this
          if (self.choiceDate) {
            const selectDate = new Date(self.choiceDate)
            const nowYear = selectDate.getFullYear() // 当前年
            const nowMonth = selectDate.getMonth() // 当前月
            const nowDate = selectDate.getDate() // 当前几号
            const nowDay = selectDate.getDay() // 当前星期几
            // 本月的开始时间
            const monthStartDate = new Date(nowYear, nowMonth, 1).getTime()
            // 本月的结束时间
            const monthEndDate = new Date(nowYear, nowMonth + 1, 0).getTime()
            // 本年的开始时间
            const yearStartDate = new Date(nowYear, 0, 1).getTime()
            // 本年的结束时间
            const yearEndDate = new Date(nowYear, 12, 0).getTime()
            // 本周的开始时间，本周的结束时间
            const weekStartDate = new Date(nowYear, nowMonth, nowDate - nowDay + 1)
            const weekEndDate = new Date(nowYear, nowMonth, nowDate + (7 - nowDay))
            // 前后三天
            const tStartDate = new Date(nowYear, nowMonth, nowDate - 2)
            const tEndDate = new Date(nowYear, nowMonth, nowDate + 2)
            // 此处以不能跨月做示范
            return time.getTime() < monthStartDate || time.getTime() > monthEndDate
          }
        }
      }
    }
}