How to implement “Clear” button in vue2-daterange-picker?

[PetroGromovo]

Looking at vue2-daterange-picker examples at https://innologica.github.io/vue2-daterange-picker/#usage

I wonder how it is implemented with “Clear” button? I need to make such button and empty values as defualt values (not 1 jan 1970). How can I do it?

Have examples from this site some fiddle links ?

Thanks!

[creinelt]

you need to set the value to { startDate: null, endDate: null }

[zainkhalid93]

this vue component does not support clearing the values, to get it fixed, you need to modify it, you can use cancel button as clearing the values, in code of daterangepicker, find the clickCancel method, in it replace this.start = startDate ? new Date(startDate) : null this.end = endDate ? new Date(endDate) : null with this.start = null this.end = null

or other way, as @creinelt said, you can make some clear button on your template, and bind click with it, on click, let suppose you have v-model="date_range", then set the value of this.date_range to { startDate: null, endDate: null } of the binded object.

[nkostadinov]

Or you could override the footer slot and add clear button , or add it outside the input as in the demo.