vue中使用vant 2 DatetimePicker怎么设置只选择年

在 Vue 中使用 Vant 2 的 DateTimePicker 组件时，如果你想限制用户只能选择年份而禁用月份和日期，可以通过传递属性 `mode` 和自定义配置来实现。Vant 的 DatePicker 组件默认支持 "date"、"time" 和 "datetime" 模式，我们可以将其设为 "year"。

首先，在你的组件中引入 Vant 的 DateTimePicker 组件，并给它一个名称：

<template>
  <van-datetime-picker v-model="selectedDate" :mode="'year'" />
</template>

然后，在数据对象中声明一个变量来保存当前选择的年份：

<script setup>
import { ref } from 'vue';
import { DateTimePicker } from 'vant';

const selectedDate = ref();
</script>

最后，你可以根据需要处理用户的输入，例如在点击确定按钮后只保留年份：

<template>
...
<button @click="onConfirm">确认</button>
...

<script setup>
...
function onConfirm() {
  // 如果不需要日期和时间，直接将年份赋值给 selectedDate
  selectedDate.value = this.selectedDate.year;
}
...
</script>

记得在实际项目中，你还需要导入并注册 Vant 插件，如果还没做的话，可以在入口文件或 main.js 中添加：

import Vant from 'vant'
Vant.use()