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()方法中获取日期实例？

编辑：有关完整代码，请参见我的gist。我已按照评论中的建议将监听器从: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);
     }
 }

VueJS Hotel Datepicker：通过事件监听器获取选定日期的问题

1 个答案: