VueJS 酒店日期选择器:通过事件侦听器获取所选日期时出现问题

Question

我是 VueJS 的新手，正在尝试实现vue-hotel-datepicker在我的项目中。但是，我不明白如何使用checkInChanged事件侦听器。

这是我的模板代码：

 <datepicker
     :startDate="startDate"
     :checkInChanged="setCheckinDate()" //probem occurs here
     :maxNights="30"
     :disabledDates="bookedDates"
     :firstDayOfWeek="1"
     :i18n="lang"
     :showYear="true"
    >
  </datepicker>

我的方法：

 methods: {
     setCheckinDate() {
       console.log('test');
     }
 }

此事件在我选择签入日期之前触发。我应该如何最好地实现这一点以及如何在我的setCheckinDate()方法中获取日期实例？

编辑：有关完整的代码，请参阅我的要点。我已经按照评论中的建议将我的听众从:checkInChanged更改为@checkInChanged，但事件没有被触发。

Answer 1

checkInChanged是一个

事件而不是一个道具，所以你应该使用v-on:check-in-changed或@check-in-changed而不是:checkInChanged并从处理程序中删除()：

    <datepicker
        :startDate="startDate"
        @check-in-changed="setCheckinDate"
         ...

你的方法应该是这样的：

   methods: {
      setCheckinDate(newDate) {
        console.log(newDate);
     }
 }