Vant的日历组件，怎么默认当天时间？

Question

Vant的日历组件，想要选择今天之前的日期，设置了最小可选日期min-date(比如是2020-01-01)，日历弹起之后默认就是从2020-01-01开始，这个可以改变吗，想要默认是当前的时间

Answer 1

<van-calendar
  v-model="currentDate"
  :min-date="minDate"
  :default-date="defaultDate"
></van-calendar>

export default {
  data() {
    return {
      currentDate: new Date(), // 当前日期
      minDate: new Date('2020-01-01'), // 最小可选日期
    };
  },
  computed: {
    defaultDate() {
      // 默认日期为当前日期
      let defaultDate = new Date();
      // 如果默认日期早于最小可选日期，则将默认日期设置为最小可选日期
      if (defaultDate < this.minDate) {
        defaultDate = new Date(this.minDate);
      }
      return defaultDate;
    },
  },
  mounted() {
    // 在 mounted 钩子函数中更新 currentDate
    this.currentDate = this.defaultDate;
  },
};

在 Vant 的日历组件中，如果想要设置最小可选日期 min-date，但是又想默认显示当前日期，可以通过设置 default-date 属性来实现。
具体来说，可以将 default-date 属性设置为当前日期，然后在 mounted 钩子函数中判断当前日期是否早于最小可选日期，如果早于，则将 default-date 属性设置为最小可选日期。
在这个例子中，我们将 default-date 属性设置为一个计算属性 defaultDate，该属性的值为当前日期或最小可选日期中较晚的一个。然后在 mounted 钩子函数中将 currentDate 更新为 defaultDate。这样就可以实现默认显示当前日期，如果最小可选日期早于当前日期，则默认显示最小可选日期。