@lanbenz/vue-date-range-picker
vue-date-range-picker
Description
datetRangePicker is a component created by vuejs，use to pick up startDate and endDate from calendar.
Software Architecture
no description
Installation
- install component in vue project
npm i @lanbenz/vue-date-range-picker - global use
main.js
import VueDateRangePicker from "@/lib/index"; Vue.use(VueDateRangePicker);
vue view
<vue-date-range-picker @changeDates="changeDates"></vue-date-range-picker>
Instructions
- vue-date-range-picker props
| prop | dataType | desc | default |
|---|---|---|---|
| default-year | number | default init year | current year |
| default-month | number | default init month，1-12 | current month |
| default-start-date | string | default init start date string，formatter"{y}-{m}-{d}" | current date string |
| default-end-date | string | default init end date string，formatter "{y}-{m}-{d}" | current date string |
| container-height | string | picker component height(width is 100%)，the height use css height values | "6rem" |
| min-pickable-date | string | minimum pickable date string，formatter: "{y}-{m}-{d}" | null |
| max-pickable-date | string | maximum pickable date string，formatter: "{y}-{m}-{d}" | null |
| pickable-after-today | string | is it pickable after today | true |
| pickable-before-today | string | is it pickable before today | true |
| scroll-down-await-time | number | the time interval to trigger event when scroll down | 500,ms |
- vue-date-range-picker event
| event | desc | callback params | callback params desc |
|---|---|---|---|
| changeDates | every time click or touch date item triggers | {startDateDat:{year: 2019, month: 11, date: 18, utcDay: 0}, endDateDat:{year: 2019, month: 11, date: 18, utcDay: 0}} |
startDateData:selected start date data，endDateData:selected end date data；year-year，month-month，date-date，utcDay-weekday |
Contribution
- Fork the repository
- Create Feat_xxx branch
- Commit your code
- Create Pull Request
keep update, and keep watching
Update records：
version0.1.14, 2019-12-03
solve the problem that while pickup date earlier than 10th every month and the date data will be NaN in iphone website.
Version History
| Version | Released | Vue | License |
|---|---|---|---|
| 0.1.15 | ^2.6.10 | ||
| 0.1.14 | ^2.6.10 | ||
| 0.1.13 | ^2.6.10 | ||
| 0.1.12 | ^2.6.10 | ||
| 0.1.11 | ^2.6.10 | ||
| 0.1.10 | ^2.6.10 | ||
| 0.1.9 | ^2.6.10 | ||
| 0.1.8 | ^2.6.10 | ||
| 0.1.7 | ^2.6.10 | ||
| 0.1.6 | ^2.6.10 | ||
| 0.1.5 | ^2.6.10 | ||
| 0.1.4 | ^2.6.10 | ||
| 0.1.3 | ^2.6.10 | ||
| 0.1.2 | ^2.6.10 | ||
| 0.1.1 | ^2.6.10 | ||
| 0.1.0 | ^2.6.10 |