How to set dates from the selected shortcut on Vue2-datepicker

Question

We have a calendar component based on the Vue2-datepicker library. There are some shortcuts defined on the date picker to enhance usability. Everything is working well except the time when the user selects the shortcut, the selected dates are not appearing on the datepickers. Any helps will be appreciated.

    import DatePicker from 'vue2-datepicker';

    <DatePicker 
        lang="en" 
        placeholder="Range" 
        :shortcuts="shortcuts"
        range v-model="rangefilter" 
        type="date"
        class="input-sm"
        input-class="form-control"
    >

    export default {
    ...
    components: { DatePicker},
    data(){
    return {
        shortcuts: [
           { text: 'Today', onClick: () => [new Date(), new Date()] },
           {
              text: 'Yesterday',
              onClick: () => [new Date(Date.now() - 3600 * 1000 * 24), new Date()]
           },
           {
              text: 'Last Week',
              onClick: () => [new Date(Date.now() - 7 * 24 * 3600 * 1000), new Date()]
           }],
    ...
    }

The library version is ^3.10.4.

Answer 1

It is a bug in the library itself please refer to this link with an answer from the maintainer regarding the issue:

https://github.com/mengxiong10/vue2-datepicker/issues/400