mengxiong10/vue2-datepicker

[Feature request] Range picker should emit event on first selected date

colq2 opened this issue · 4 comments

colq2 commented

What problem does this feature solve?

It is not possible to listen to the select event which is emitted by CalendarPanel in CalendarRange. It would be awesome to get this possibility.

Use case

For example we have a range picker, but it is possible to have a same-day range. A UX would be if the user could only pick once and we can add a computed property for the end date. Which would be by default the same date as the start date.

What does the proposed API look like?

  1. Approach
    Also emit the input event on the first date pick with [start_date, null]

  2. Approach
    Emit the select event delegated from CalendarPanel to DatePicker

Thank you for your great work!

colq2 commented

Same as #428

Yes, I'll add the feature in next version.

It'll emit a pick event when the date is selected .

<date-picker
  v-model="value"
  range
  placeholder="Select date range"
  @pick="handlePick"
></date-picker>
methods: {
  handlePick(date) {
    this.value = [date, new Date(date.getTime() + 30 * 24 * 3600 * 1000)]
 },
},

v3.4.0 added it.