vant 时间选择器 区间

你可以使用 Vant 组件库中的时间选择器来实现区间选择。具体的步骤如下：

1. 安装 Vant 组件库：在你的项目中安装 Vant 组件库，可以使用 npm 或者 yarn 进行安装。

npm install vant --save

2. 引入时间选择器组件：在需要使用时间选择器的页面或组件中，引入 Vant 时间选择器组件。

import { DatetimePicker } from 'vant';

Vue.use(DatetimePicker);

3. 使用时间选择器：在模板中使用 `van-datetime-picker` 标签，并设置 `type` 属性为 `datetimerange`，表示选择日期和时间的区间。

<van-datetime-picker
  v-model="date"
  type="datetimerange"
  :min-date="minDate"
  :max-date="maxDate"
/>

4. 设置最小和最大日期：你可以通过设置 `min-date` 和 `max-date` 属性来限制用户选择的日期范围。这两个属性的值都是 Date 类型的对象。

data() {
  return {
    date: [],
    minDate: new Date(),
    maxDate: new Date(new Date().getFullYear() + 1, 11, 31)
  }
}

在上面的代码中，我们设置了 `minDate` 为当前日期，也就是用户只能选择今天以后的日期；设置了 `maxDate` 为明年的最后一天，用户不能选择明年之后的日期。

这样，你就可以使用 Vant 组件库中的时间选择器来实现区间选择了。记得根据你的项目环境适当调整代码。