在 Vue-2 Datepicker 上设置默认开始日期范围？答案

【问题标题】：Make Default Start Date Range on Vue-2 Datepicker?在 Vue-2 Datepicker 上设置默认开始日期范围？
【发布时间】：2021-08-13 10:50:08
【问题描述】：

我有使用 Vue2-Datepicker 的日期选择器，这是我的组件的样子

<date-picker
 v-model="closingRange"
 range
 valueType="format"
 :default-value="new Date()"
 :disabled-date="disabledBefore"
></date-picker>

并调用了方法disbaledBefore

disabledBefore(date) {
 let dayBefore = this.$moment(this.firstDateIfNull).format(
                "YYYY-MM-DD"
            );
 const beforeToday = new Date(dayBefore);
       beforeToday.setHours(0, 0, 0, 0);
  return date < beforeToday; // Assume < 25 May Not Selected
}

如何在数据范围的开始日期自动选择 5 月 26 日并且不能更改。所以用户只能更改结束日期。

【问题讨论】：

标签： vue.js date-range

【解决方案1】：

就像这样：

<date-picker
 v-model="closingRange"
 range
 valueType="format"
 :default-value="new Date()"
 :disabled-date="disabledBefore"
 :min-date="minDate"
></date-picker>

<script>
import { formatDate } from "@/utils/date";
export default {
  name: "index",
  props: {
    label: String,
    value: [String, Object, Date, Number],
    minDate: {
      type: [String, Date, Number],
      default: () => {
        return new Date(1970, 1, 1);
      },
    },
  },
  data() {
    return {};
  },
  methods: {},
};
</script>

【讨论】：