van-calendar设置初始范围值

可以使用van-calendar组件的min-date和max-date属性来设置初始范围值。min-date属性可以设置最小的可选日期，max-date属性可以设置最大的可选日期。例如：

<van-calendar
  :min-date="minDate"
  :max-date="maxDate"
  v-model="selectedDate"
/>

在组件的data选项中定义minDate和maxDate的值即可，例如：

data() {
  return {
    minDate: new Date(2021, 0, 1), // 最小可选日期为2021年1月1日
    maxDate: new Date(2021, 11, 31), // 最大可选日期为2021年12月31日
    selectedDate: new Date() // 初始选中日期为今天
  }
}

这样就可以设置van-calendar组件的初始范围值了。

相关问题

van-calendar设置初始值

在Vanilla JavaScript中，可以使用以下代码设置Van-calendar的初始值：

var calendar = new vanCalendar({
  input: '#calendar-input',
  defaultValue: '2021-09-01'
});

在这个例子中，我们创建了一个Van-calendar实例，并将其绑定到一个ID为“calendar-input”的输入框上。我们还使用了defaultValue属性来设置初始值为“2021-09-01”。

你可以根据你的需要更改输入框的ID和初始值。

van-calendar在onMouned中设置范围值

可以在 `mounted` 钩子函数中设置 `van-calendar` 的范围值。

首先，在组件中引入 `DatePicker` 组件，如下所示：

<template>
  <div>
    <van-calendar v-model="date" :min-date="minDate" :max-date="maxDate" />
  </div>
</template>

<script>
import { DatePicker } from 'vant';

export default {
  components: {
    [DatePicker.name]: DatePicker,
  },
  data() {
    return {
      date: new Date(),
      minDate: new Date(2021, 0, 1), // 设置最小日期
      maxDate: new Date(2021, 11, 31), // 设置最大日期
    };
  },
  mounted() {
    // 在 mounted 钩子函数中更新 minDate 和 maxDate 的值
    this.minDate = new Date(2020, 0, 1);
    this.maxDate = new Date(2022, 11, 31);
  },
};
</script>

在上面的例子中，我们设置了 `minDate` 和 `maxDate` 的初始值，然后在 `mounted` 钩子函数中更新它们的值。这样，当组件渲染完成后，`van-calendar` 就会自动更新可选日期的范围。