🌍
多日曆系統支援
內建西曆、民國曆、佛曆、日本曆、伊斯蘭曆等多種日曆系統,滿足全球化需求
pnpm add vue-datepicker
npm install vue-datepicker
yarn add vue-datepicker
<template>
<div>
<!-- 基本日期選擇器 -->
<DatePicker v-model="selectedDate" />
<!-- 帶時間的日期選擇器 -->
<DatePicker v-model="selectedDateTime" :showTime="true" theme="violet" />
<!-- 民國曆日期選擇器 -->
<DatePicker v-model="rocDate" calendar="roc" locale="zh-TW" />
</div>
</template>
<script setup lang="ts">
import { ref } from "vue";
import { DatePicker } from "vue-datepicker";
const selectedDate = ref(null);
const selectedDateTime = ref(null);
const rocDate = ref(null);
</script>
支援 ISO 字串、JavaScript Date 物件、自訂格式等多種輸出方式。
內建日期範圍驗證、格式驗證、必填驗證,提供完整錯誤處理。
從基本日期格式到複雜的日曆外掛,滿足各種使用情境。
Vue 3 + TypeScript + Tailwind CSS + @internationalized/date + dayjs
開始使用 Vue Datepicker,為您的 Vue 3 應用添加強大而優雅的日期選擇功能!