插件名称 | vue-date-picker |
---|---|
发布时间 | 2020年12月31日 |
插件作者 | ridewn |
Vue日期选择器组件。
$ npm install vue-md-date-picker --save
最常见的用例
<DatePicker
v-if="show"
v-model="date"
@close="show = false"
/>
请注意,有一个v-if
指令和一个@close
事件。这是因为日期选择器允许您选择显示的时间以及如何关闭它。
设定最小日期以供选择
<DatePicker
v-if="show"
v-model="date"
@close="show = false"
min="2017-8-16"
/>
设置最大日期以供选择
<DatePicker
v-if="show"
v-model="date"
@close="show = false"
max="2017-8-24"
/>
设置日期范围以供选择
<date-picker
v-if="show"
v-model="date"
@close="show = false"
min="2017-8-16"
max="2017-8-24"
/>
您还可以指定一种颜色来更改日期选择器的主题
<DatePicker
color="#F44336"
@close="show = false"
v-if="show"
v-model="date"
/>
如果要淡入日期选择器,还提供了一个过渡
<transition name="calendar-fade">
<DatePicker
@close="show = false"
v-if="show"
v-model="date"
/>
</transition>
官网:https://github.com/ridewn/vue-date-picker
GitHub下载:https://github.com/ridewn/vue-date-picker/archive/master.zip