vue时间控件常用处理

1、处理时间后面时间不能大于前面的时间，前面时间大于等于当前日期
<DatePicker
                        v-model="formData.startTime"
                        type="datetime"
                        format="yyyy-MM-dd"
                        placeholder="请选择"
                        :options="startTimeOption"
                        @on-change="beginDate"
                      ></DatePicker>
<DatePicker
                        v-model="formData.endTime"
                        type="datetime"
                        format="yyyy-MM-dd"
                        :editable="false"
                        placeholder="请选择"
                        :disabled="isEndTimeDisabled"
                        :options="endTimeOption"
                        @on-change="endDate"
                      ></DatePicker>
data() {
   return {
      endTimeOption: {
        disabledDate(date) {
          let rd = this.formData.startTime
          return date.valueOf() < rd
        }
      },
      startTimeOption: {
        disabledDate(date) {
         return date && date.valueOf() < Date.now() - 86400000
        }
      },
      isEndTimeDisabled: true
   }
 method() {
   beginDate(date) {
      // 时间转换
      // this.formData.startTime = date
      if (this.formData.startTime) {
        if (this.formData.startTime > this.formData.endTime) {
          this.formData.endTime = ''
        }
        this.isEndTimeDisabled = false
      } else {
        this.formData.endTime = ''
        this.isEndTimeDisabled = true
      }
    },
    endDate(date) {
      // 时间转换
      // this.formData.endTime = date
    },
}
}

2、取年且不能超过当前年处理
 <DatePicker
                        v-model="formData.taskYear"
                        type="year"
                        placeholder="请选择计划年份"
                        style="width: 100%"
                        clearable
                        :editable="false"
                        :options="endTimeOption"
                        @on-change="onDetePickerChange"
                      />
data() {
    let self = this
return {
    endTimeOption: {
        disabledDate(date) {
          let nowDate = new Date()
          let year = nowDate.getFullYear()
          return date.getFullYear() < year
        }
      }
}
method() {
   onDetePickerChange(date) {
      this.formData.taskYear = date
    }
}

验证规则

startTime: [
  {
    required: true,
    message: '注意：请选择开工时间'
  }
],
endTime: [
  {
    required: true,
    message: '注意：请选择竣工时间'
  }
],

后端时间加上注解东八区

@JsonFormat(pattern = "yyyy-MM-dd", timezone = "GMT+8")
@DateTimeFormat(pattern = "yyyy-MM-dd")