Canli Demolar

Asagidaki tum ornekler canlidir -- etkilesim icin dugmelere tiklayin.

Tema Degistirici

Acik ve koyu temalar arasinda gecis yapin. Bilesen CSS degiskenleri ile otomatik uyum saglar.

Tekli Tarih

Varsayilan tarih secici, ISO format ciktisi.

<DatePicker v-model="date" placeholder="Tarih secin" lang="tr" />

Ozel Format

Gosterim ciktisini kontrol etmek icin display-format prop'unu kullanin.

<DatePicker v-model="date" display-format="DD/MM/YYYY" lang="tr" />

Tarih Araligi

range prop'u ile aralik secimini etkinlestirin.

<DatePicker
  v-model:range-start="start"
  v-model:range-end="end"
  range
  lang="tr"
/>

Saat -- 24 Saat

type="time" ile bagimsiz saat secici.

<DatePicker v-model="time" type="time" lang="tr" />

Saat -- 12 Saat AM/PM

AM/PM degistirici icin hour-format="12" ekleyin.

<DatePicker v-model="time" type="time" hour-format="12" lang="tr" />

Tarih ve Saat

type="datetime-local" ile tarih ve saati birlestirin.

<DatePicker v-model="dt" type="datetime-local" lang="tr" />

Min / Max Kisitlamalar

min ve max prop'lari ile secilebilir tarihleri sinirlayin.

<DatePicker v-model="date" min="2026-02-01" max="2026-02-28" lang="tr" />

Coklu Dil

15 yerlesik dil arasinda gecis yapin.

Dil Secin

<DatePicker v-model="date" :lang="lang" />