MikaelEdebro / vue-airbnb-style-datepicker

A VueJs datepicker with a similar look and functionality as the popular AirBnb datepicker.
https://mikaeledebro.gitbooks.io/vue-airbnb-style-datepicker/
MIT License
505 stars 105 forks source link

Why not use a v-model for the dates? #121

Open yooouuri opened 4 years ago

yooouuri commented 4 years ago

I am using typescript.

Created two variables, start and end (dates). Update the variables with new dates:

...
@date-one-selected="val => { start = val }"
@date-two-selected="val => { end = val }"
...

Now I have to implement two watchers to know if the dates changed:

@Watch('start')
public onStartChanged(): void {
  this.$emit('input', {
    start: this.start,
    end: this.end,
  });
}

@Watch('end')
public onEndChanged(): void {
  this.$emit('input', {
    start: this.start,
    end: this.end,
  });
}

If we use a v-modal to hold the dates, no events are needed to update the new dates and we can only use one watcher to check if one of the dates changed.

...
v-modal="dates"
...

So dates will be an object holding start and end.