vue2 datepicker Clearing the date or choosing a date has no effect

Question

I just downloaded this today and using it in my project. Everything seems to work where I see it displaying my date from the v-model. However, when choosing a date, it doesn't change the value in the text box.

Also, clicking on "x" doesn't clear the value and show placeholder

I'm displaying this text inside a client table from vue-tables-2

Here's how I'm using it btw

<DatePicker
v-model="props.row.DueDate"
lang="en"
format="MM-DD-YYYY"
:not-before="new Date()"
placeholder="Select a Date"
input-class="form-control"
@change="selectDate"
append-to-body>

Also, I just realized that when clicking on "x" icon it's actually calling the CHANGE event where my function "selectDate" is getting called with an invalid date of course. This doesn't make any sense. Any idea why this may be happening?

I have created an issue on github for this as well https://github.com/mengxiong10/vue2-datepicker/issues/278

Answer 1

I think the vue datepicker has custom @ functions? try using: @selected, @opened, and @closed let me know if that works!