mengxiong10 / vue2-datepicker

A datepicker / datetimepicker component for Vue2
https://mengxiong10.github.io/vue2-datepicker/index.html
MIT License
1.52k stars 407 forks source link

[Question] - Date **range** month picker customization #649

Closed smplyjr closed 2 years ago

smplyjr commented 2 years ago

Hi, this maybe a dumb question but...

Is it possible to customize the month initially shown from the range datepicker using the illustration down below? image

By default, we you open the datepicker, you will be presented by the following image

The main reason why I wanted this is because I will be using the datepicker primarily for exporting reports. And the dates of each reports are not future dates. So I wanted the range to work like backwards. Notice how I disabled the dates days-after-today, because the records after-today is of course hasn't been created yet.

Thanks

mengxiong10 commented 2 years ago

use defaultValue.

<date-picker  :default-value="defaultValue" />
data() {
  const previous = new Date()
  previous.setMonth(previous.getMonth() - 1)
  return {
     defaultValue: [previous, new Date()]
  }
}
smplyjr commented 2 years ago

That is a quick response man, I didn't expect it! Kudos.

It works from the first time you open the range picker, however, after I open it and select from one of the shortcuts I added, the range picker back to it's default state when I re-open it even after adding the code boxed on my onShortcut select handler. image

This solution you gave here works even after multiple selecting from shortcuts and re-opening.

mengxiong10 commented 2 years ago

@smplyjr-dev If the value is not undefined, the defaultValue is invalid. Yes, you need rewrite updateCalendars like this