Jquery “在我的VUE应用程序中”;这";关键字不选择DOM对象

Jquery “在我的VUE应用程序中”;这";关键字不选择DOM对象,jquery,vue.js,fullcalendar,vue-component,Jquery,Vue.js,Fullcalendar,Vue Component,我正在我的Calendar.VUE组件中编写VUE.js和FullCalendar应用程序。遇到问题时,this关键字将不会选择元素。组件的模板如下所示: <template> <div id="calendar" :event-sources="eventSources" @event-selected="eventSelected" @event-created="eventCreated" :config="config">

我正在我的Calendar.VUE组件中编写VUE.js和FullCalendar应用程序。遇到问题时,this关键字将不会选择元素。组件的模板如下所示:

    <template>
       <div id="calendar" :event-sources="eventSources" @event-selected="eventSelected" @event-created="eventCreated" :config="config">
          <button id="red" v-on:click="time">time</button>
          <full-calendar id="target" ref="calendarC" :navLinks="true" :event-sources="eventSources" @event-selected="eventSelected" @day-click="click"@event-created="eventCreated" :config="config"></full-calendar>  
       </div>
   </template>

因此,当我单击日历中的某个元素时,id为红色的按钮变为红色,这让我知道jQuery工作正常。但我单击的元素不会变为红色。

据我所知,Vue.js没有“选定”元素的内置概念。您最好使用
day click
事件返回的
date
来确定CSS选择器是什么,然后使用它来设置背景色。根据对相关SO问题的回答,有关一些未经测试的代码,请参见下文:

click: function(date, jsEvent, view) {
    $("#red").css('background-color', 'red');

    var moment = date.toDate();
    MyDateString = moment.getFullYear() + '-'
                   + ('0' + (moment.getMonth() + 1) ).slice(-2)
                   + "-" +('0' + moment.getDate()).slice(-2);
    $('[data-date='+MyDateString+']').css({'background-color', 'red'});
}
资料来源:

click: function(date, jsEvent, view) {
    $("#red").css('background-color', 'red');

    var moment = date.toDate();
    MyDateString = moment.getFullYear() + '-'
                   + ('0' + (moment.getMonth() + 1) ).slice(-2)
                   + "-" +('0' + moment.getDate()).slice(-2);
    $('[data-date='+MyDateString+']').css({'background-color', 'red'});
}