DatePicker 日期选择器

用于选择日期

基础用法

日期格式

设置属性 format 可以改变日期的显示格式。

注意，format 只是改变显示的格式，并非改变 value 值。

禁用状态

可以设置 disabled 属性来实现禁用状态

日期范围

设置type 为 daterange 可开启日期范围选择

在选择日期范围时，默认情况下左右面板会联动。如果希望两个面板各自独立切换当前月份，可以使用unlink-panels属性解除联动。

带有确认操作

设置属性 confirm，选择器会有清空和确定按钮。确认按钮并没有影响日期的正常选择。

快捷方式

设置属性 shortcuts 可以设置快捷选项，详见示例代码。

DatePicker Attributes

参数	说明	类型	可选值	默认值
v-model	绑定值	string / array	—	—
type	类型，支持选择单个日期或者选择日期范围	string	date / daterange	—
placeholder	选择时的占位符	string	—	—
readonly	完全只读，开启后不会弹出选择器	boolean	—	false
disabled	禁用	boolean	—	false
format	日期格式化	string	年：`yyyy`，月：`MM`，日：`dd`	'yyyy-MM-dd'
separator	选择范围时的分隔符	string	—	'-'
unlink-panels	在范围选择器里取消两个日期面板之间的联动	boolean	—	false
confirm	是否显示底部控制栏	boolean	—	false
clearable	是否显示清除按钮	boolean	—	true
shortcuts	设置快捷选项，需要传入数组对象	[{ text: string, value: function }]	—	—

DatePicker Events

事件名	说明	参数
on-change	日期发生变化时触发	格式化后的日期
on-confirm	点击确定按钮时触发	格式化后的日期
on-clear	在清空日期时触发	—