Ant Design Vue RangePicker 动态设置不可选择日期和时间

需求：不能选择未来的时间，可以选择之前的任意时间，选择完开始时间后，限制可选择日期为当月，例如选择完14号后，只能选择9月的日期了

1、引入rangePicker组件

      <a-form-item label="添加时间" >
                <a-range-picker
                  @calendarChange="onCalendarChangeDate"//点击日期时获取开始时间
                  @openChange="()=>this.selectedStartDate = null"// 每次打开时间筛选组件重新选择时间
                  :disabled-date="disabledDate"  //限制可选择日期
                  />
      </a-form-item>

2、通过如何用 onCalendarChange 和 disabledDate 来限制动态的日期区间选择

   onCalendarChangeDate(dates) {
      this.selectedStartDate = moment(dates[0])
    }
   disabledDate(current) {
   //不能选择未来的时间，可以选择之前的任意时间
      if (!this.selectedStartDate) {
        return current && current > moment().endOf('day')
      }
      // 获取选择时间的月初和月末
      const start = moment(this.selectedStartDate).startOf('month')
      const end = moment(this.selectedStartDate).endOf('month')
      return current && (current < start || current > end)
    },

灵感来自juejin.cn/post/703856…