DatePicker 日期选择器

规则

基础示例（日期时间区间）

Props 配置示例

日期选择（date）

日期时间（datetime）

日期范围（daterange）

整段禁用

尺寸对比（迷你 / 小 / 中）

Events 示例

Props

名称	类型	默认值	说明
align	'left' | 'center' | 'right'	'left'	日期选择面板和输入框的对齐方式
clear-icon	Component	IconOperationfaild	自定义清空图标
clearable	boolean	true	是否显示清除按钮
default-time	string | string[]	'00:00:00' | ['00:00:00','00:00:00']	datetime / datetimerange 的默认时间
default-value	string | Date	new Date()	当选中值为空时，面板打开默认显示时间
disabled	boolean	false	禁用
editable	boolean	true	文本框可输入
end-placeholder	string	''	范围选择结束日期占位
format	string	'yyyy-MM-dd'	显示在输入框中的格式
format-weeks	(customWeeks: number, weekFirstDays: string[]) => string	—	格式化周次序号
isutc8	boolean	false	切换系统默认时区（时间仍显示为东八区时间）
label	string	''	过滤器模式标题 / 开始位置标题
modelValue / v-model	Date | string | number | Array	—	绑定值
name	string	''	原生属性
picker-options	IPickerOptions	—	禁用、快捷选项等配置
placeholder	string	''	非范围选择占位
popper-append-to-body	boolean	true	是否将弹出框插入至 body
popper-class	string	—	下拉弹框 class
popper-options	IPopperOption		弹出层参数
range-separator	string	'-'	范围分隔符
readonly	boolean	false	是否只读
shape	string	—	切换至过滤器模式
show-timezone	boolean	false	是否开启时区选择
show-week-number	boolean	false	是否展示周次序号
size	'medium' | 'small' | 'mini'	—	输入框尺寸
start-placeholder	string	''	范围选择开始日期占位
step	IStep	—	时分秒步长
suffix-icon	Component	IconCalendar	自定义后置图标
time-arrow-control	boolean	false	通过箭头按钮控制时间选择
time-format	string	'HH:mm:ss'	时间格式辅助
tip	string	—	过滤器模式提示信息
type	IType	'date'	显示类型
unlink-panels	boolean	false	范围选择取消面板联动
validate-event	boolean	true	输入时是否触发表单校验
value-format	string	—	指定绑定值格式

Events

名称	类型	说明
blur	() => void	input 失去焦点触发
change	(value: Date) => void	用户确认选定的值时触发
focus	() => void	input 获得焦点触发