PlusProComponents

主题

DatePicker ​

简介 ​

PlusDatePicker 是由两个 el-date-picker （属性 type 不包含 range）组件组成，核心功能点是两个选择可以独立开来。

基础用法 ​

DatePicker API ​

DatePicker Attributes ​

名称说明类型默认值是否必须
model-value / v-model绑定值array 否
typeel-date-picker 的类型string datetime否
format deprecated v0.1.0显示在输入框中的格式,已废弃stringYYYY-MM-DD HH:mm:ss否
valueFormat绑定值的格式。 不指定则绑定值为 Date 对象stringYYYY-MM-DD HH:mm:ss否
rangeSeparator开始时间和结束时间中间的分隔符string/否
startProps开始的el-date-picker 的 props（支持所有）object ElDatePickerProps{}否
endProps结束的el-date-picker 的 props （支持所有）objectElDatePickerProps{}否
startDisabledDate开始的el-date-picker 的 disabledDatefunction startDisabledDate否
endDisabledDate结束的el-date-picker 的 disabledDatefunction endDisabledDate否
...............

提示

v0.1.0

...表示同时支持所有 el-date-picker Attributes，startProps 和 endProps 里面配置的属性优先级更高

startDisabledDate ​

默认值

js
const startDisabledDate = (startTime, endValue) => {
  if (!endValue) return false
  return startTime.getTime() > new Date(endValue).getTime()
}

endDisabledDate ​

默认值

js
const endDisabledDate = (endTime, startValue) => {
  if (!startValue) return false
  return endTime.getTime() < new Date(startValue).getTime()
}

DatePicker Events ​

名称说明类型
change用户选值时触发function

提示

el-date-picker 的其他事件的支持写法 如 blur，如下示例

示例：

html
<PlusDatePicker :start-props="{onBlur: () => {} }" :end-props="{onBlur: () => {} }" />

Exposes ​

名称说明类型
startPickerInstance开始的el-date-pickerobject
endPickerInstance结束的el-date-pickerobject