vue.js - 日期组件有有开始日期和结束日期 怎么处理选中的时间在一个月30天？

Question

日期组件有有开始日期和结束日期 怎么处理选中的时间在一个月30天？

<a-col class="gutter-row" :span="6">        <a-form-item label="日期" :label-col="{ span: 7 }" :wrapper-col="{ span: 16 }">            <a-range-picker  :value="approvalDate"  :disabled-date="disabledDate"  @change="DateFn"/>             </a-form-item>      </a-col>  data() {    return {form{rovalDateStart ：null，rovalDateEnd ：null}}DateFn(dates, dateStrings) {      this.rovalDate = dates;      this.form.rovalDateStart = dateStrings[0];      this.form.rovalDateEnd = dateStrings[1];    },

Answer 1

<template>  <a-col class="gutter-row" :span="6">    <a-form-item label="日期" :label-col="{ span: 7 }" :wrapper-col="{ span: 16 }">      <a-range-picker :value="approvalDate" :disabled-date="disabledDate" @change="DateFn"/>    </a-form-item>  </a-col></template><script>export default {  data() {    return {      approvalDate: [null, null],      form: {        rovalDateStart: null,        rovalDateEnd: null      }    };  },  methods: {    DateFn(dates, dateStrings) {      this.approvalDate = dates;      this.form.rovalDateStart = dateStrings[0];      this.form.rovalDateEnd = dateStrings[1];    },    disabledDate(current) {      // 如果没有选择开始日期或者结束日期，不禁用任何日期      if (!this.form.rovalDateStart || !this.form.rovalDateEnd) {        return false;      }      const start = new Date(this.form.rovalDateStart);      const end = new Date(this.form.rovalDateEnd);      const currentDay = new Date(current);      // 确定当前日期是不是在开始日期后30天内或者结束日期前30天内      const afterStart = currentDay >= start && currentDay <= new Date(start.getTime() + (30 * 24 * 60 * 60 * 1000));      const beforeEnd = currentDay <= end && currentDay >= new Date(end.getTime() - (30 * 24 * 60 * 60 * 1000));            // 如果当前日期不在这个范围内，就禁用这个日期      return !(afterStart || beforeEnd);    }  }};</script>