Skip to content

介绍


本文档主要用于描述 ShadcnTimePicker 组件的一些特性和用法。

用法

查看代码
vue
<template>
    <ShadcnTimePicker v-model="value" />
</template>

占位符 (placeholder)

查看代码
vue
<template>
    <ShadcnTimePicker v-model="value" placeholder="Enter string" />
</template>

禁用 (disabled)

查看代码
vue
<template>
    <ShadcnTimePicker v-model="value" disabled />
    <ShadcnTimePicker v-model="value" :disabled="false" />
</template>

清空 (clearable)

查看代码
vue
<template>
    <ShadcnTimePicker v-model="value" clearable />
    <ShadcnTimePicker v-model="value" :clearable="false" />
</template>

快捷时间 (quick-times)

查看代码
vue
<template>
    <ShadcnTimePicker v-model="value" :quickTimes="['09:00', '12:00', '18:00']" />
</template>

格式 (format)

查看代码
vue
<template>
    <ShadcnTimePicker v-model="value" format="HH:mm" />
    <ShadcnTimePicker v-model="value" format="HH:mm:ss" />
    <ShadcnTimePicker v-model="value" format="hh:mm A" />
    <ShadcnTimePicker v-model="value" format="hh:mm:ss A" />
</template>

时间选择器 (Time Picker) 属性

时间选择器 (Time Picker) 事件

时间选择器 (Time Picker) 插槽