oa/documentation/plugins/datepicker/datepicker-time-single-documentation.md

state

state
date 2021-02-28T16:20:00.000Z

Timepicker

<VCalendar /> can be turned into a simple time picker if needed. You can add the is24hr attribute to display hours in 24h format. Check the code example for more details about usage.

<script setup lang="ts">

const date = ref(null)
</script>

<template>
  <ClientOnly>
    <VDatePicker
      v-model="date"
      mode="dateTime"
      is24hr
    >
      <template #default="{ inputValue, inputEvents }">
        <VField>
          <VControl icon="lucide:clock">
            <input
              class="input v-input"
              type="text"
              :value="inputValue"
              v-on="inputEvents"
            >
          </VControl>
        </VField>
      </template>
    </VDatePicker>
  </ClientOnly>
</template>