Vant4+Vue3 实现年月日时分时间范围控件

<van-popup
	v-model:show="showDatePick"
	position="bottom"
	:overlay-style="{ zIndex: 1000 }"
>
	<van-picker-group
		title="时间范围"
		:tabs="['开始日期', '结束日期']"
		@confirm="onConfirmDate"
		@cancel="onCancelDate"
	>
		<div style="display: flex; width: 100%">
			<van-date-picker
				v-model="formData.startTime"
				style="width: 60%"
			/>
			<van-time-picker
				v-model="formData.startCurrentTime"
				style="width: 40%"
			/>
		</div>

		<div style="display: flex; width: 100%">
			<van-date-picker
				v-model="formData.endTime"
				style="width: 60%"
			/>
			<van-time-picker
				v-model="formData.endCurrentTime"
				style="width: 40%"
			/>
		</div>
	</van-picker-group>
</van-popup>

const showDatePick = ref(false)
const formData = ref<Record<string, any>>({
	startTime: [],
	startCurrentTime: [],
	endTime: [],
	endCurrentTime: [],
})

后面把数据做下拼接转换就可以了