日期选择和配合输入框的日期选择
选个单个日期,可以选择年、月份、日期、日期 + 时间, 通过 format 控制:
YYYY、YYYY-MM、YYYY-MM-DD、 YYYY-MM-DD HH:mm、YYYY-MM-DD HH:mm:ss
默认为 YYYY-MM-DD
可以选择单选、多选、范围,可以和 format 进行组合:
single、multiple、range
默认为 range
禁用 | 只读
{{ multipledp.join(',') }}
禁用 | 只读
可以通过多种方式实现时间禁用
minDate, maxDate: 禁用的最大最小时间
maxRange: 禁用的最大可选时间范围,格式为 2D、2M、2Y. 数字 + 单位
disable、enable: 数组,可以为函数、时间、{from, to} 对象(from,to值为 Date, 可已实现minDate, maxDate功能)
disabledDate: 函数,参数为对应的时间
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
value | 日期的值 | Date|Array|Number | null |
model | 模式,可选值有“single”,“range”, “multiple” | String | single |
format | 时间格式:YYYY-MM-DD HH:mm:ss | String | YYYY-MM-DD |
maxDate | 最大可选时间 | Date | null |
minDate | 最小可选时间 | Date | null |
maxRange | 最大可选区间,格式为 /\d+[DMY]/ | String | null |
disable | 禁止的时间,格式可以为:[Date, Function, {from: Date, to: Date}] | Array | null |
enable | 可用的时间,格式可以为:[Date, Function, {from: Date, to: Date}] | Array | null |
disabledDate | 禁止时间函数,参数为对应的时间 Date | Function | null |
rangeSeparator | 选择时间区间是中间的分割符号,只在 model 为 range 时生效 | String | ~ |
showConfirm | 是否显示确认按钮。在多选强制为: true,其他情况默认为 false | Boolean | - |
onlyMonth | 是否只选择月份(兼容老的API,尽量使用 format代替) | Boolean | false |
enableTime | 是否显示时间(兼容老的API,尽量使用 format代替) | Boolean | false |
enableSeconds | 是否显示秒(兼容老的API,尽量使用 format代替) | Boolean | false |
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
inline | 是否脱离文档流,ture则用relative定位,false则用absolute定位 | Boolean | true |
事件名 | 说明 | 返回值 |
---|---|---|
on-change | 值改变时触发 | 最新的值 |
on-finish | 选择结束触发 | null |
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
placeholder | 未选择时间时的提示语 | String | 请选择日期 |
icon | 输入框左边的 icon | String | calendar |
clearable | 是否显示清除 icon | Boolean | false |
position | 弹窗的位置,会根据窗口大小自适应,可选值 'bottomLeft', 'bottomRight', 'topLeft', 'topRight' | String | null |
disabled | 是否禁止 | Boolean | false |
readonly | 是否只读 | Boolean | false |
事件名 | 说明 | 返回值 |
---|---|---|
on-enter | 焦点在input, 按下enter键触发 | event |
on-focus | 获取焦点时触发 | event |
on-blur | 失去焦点时触发 | event |
on-input | 输入时触发 | value, event |
on-change | 值改变时触发 | value, event |