``` yarn add time-range-picker npm i time-range-picker
npm install time-range-picker
yarn add time-range-picker
npm i time-range-picker
依赖项：element-plus
`
$3
`js
// 局部注册
import TimeRangePicker from 'TimeRangePicker'
// 全局注册
import TimeRangePicker from 'TimeRangePicker'
Vue.use(TimeRangePicker)
// 使用
$3
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
| --------------------- | ------------------------------------------------ | ------------- | ----------------------- | ------------------------------------------- |
| start | 开始日期时间（必填） | String | -- | |
| end | 结束日期时间（必填） | String | -- | |
| type | 选择类型 | String | 见下方说明 1 | date |
| placeholder | 选择框默提示文字，前后用 / 隔开 | String | | 见下方说明 2 |
| value-format | 值类型 | String | 见下方说明 3 | |
| disabled | 是否禁用 | Boolean | | false |
| size | 组件大小 | String | large medium small mini | medium |
| pickerOptions | 附加参数 | Object | 见下方说明 4 | {start: '00:00',step: '00:60',end: '23:00'} |
| clearable | 是否显示清除按钮 | Boolean | | true |
$3
`
time 时间选择
date-time 日期时间选择
date 日期选择（默认）
year-month 年月选择
month 月份选择
year 年份选择
time-select时间段范围选择
`
$3
`
time 起始时间/结束时间
date-time 起始时间/结束时间
date 起始日期/结束日期
year-month 起始月份/结束月份
month 起始月份/结束月份
year 起始年份/结束年份
time-select起始时间/结束时间
`
$3
`
time 'HH:mm', 'HH', 'HH:mm:ss'
date-time 'yyyy-MM-dd HH:mm:ss'
date 'yyyy-MM-dd HH:mm:ss', 'yyyy-MM-dd'
year-month 'yyyy-MM-dd'
month 'MM'
year 'yyyy'
time-select'HH:mm'
`
$3
`
start 开始时间 string — 00:00 (time-select有效)
end 结束时间 string — 23:59 (time-select有效)
step 间隔时间 string — 00:60 (time-select有效)
startDisabledDate(time, start, end) 开始时间限制方法 (date date-time 有效，同原生disabledDate方法, 后面的第二和第三个参数是开始时间和结束时间)
endDisabledDate(time, start, end) 结束时间限制方法 (date date-time 有效，同原生disabledDate方法, 后面的第二和第三个参数是开始时间和结束时间)
`
#### 组件默认导出了常见的几个时间：
`ts
interface CommonDate {
currentYear: string[], 本年第一天到今天
currentMonth: string[], 本月第一天到今天
currentDay: string[], 本日0点到23点
pastOneYear: string[], 近一年
pastOneMonth: string[], 近一月
nowDate: string, 当前时间
}
``