CroudTech / vue-fullcalendar

FullCalendar Wrapper for vue
MIT License
483 stars 100 forks source link

@event-mouseover and @event-mouseout not being emitted #188

Open adlaws opened 5 years ago

adlaws commented 5 years ago

Howdy!

I've noticed that the @event-mouseover and @event-mouseout events don't seem to be firing - a simple demo of the problem is here:

https://codesandbox.io/s/v6m2vw6wr7

You can see that if you click on the single event on the calendar an alert will appear (as expected), but when mousing in and out of the event nothing happens (I would expect to get spammed with alerts).

The versions I'm using (as should be applied in the problem demo link above) are Vue v2.6.7 and vue-full-calendar v2.7.0, and I'm testing on Windows 10, Chrome Version 72.0.3626.109 (Official Build) (64-bit), in case that's useful information.

I can see in Calendar.vue that the corresponding FullCalendar events are $emitted as "Vue friendly" events via the defaultConfig() setup around line 110, like so...

    eventMouseover(...args) {
        self.$emit('event-mouseover', ...args)
    },
    eventMouseout(...args) {
        self.$emit('event-mouseout', ...args)
    },

...which looks to me (with my admittedly limited knowledge of Vue) like it should work. However, this doesn't seem to be working like the eventClick, eventRender etc transformations only a couple of lines earlier, even though it's all the same kind of thing. Weird, to say the least.

This isn't a killer issue (I'm working around it - see below for more details on that), but it would be nice to define the event handlers in a more Vue-like fashion using the @event-mouseover and @event-mouseout directives (as in my example linked to above).

My current workaround is simply to provide the FullCalendar config object from the computed section of my component, and assign the event handler functions there rather than using the @ directives:

config: function()
{
    return {
        eventMouseover: this.myMouseoverHandler,
        eventMouseout: this.myMouseoutHandler
    };
}

… which all works just fine.

Anyway, as I said, not a huge issue, but maybe worth looking into.

Cheers!

BrockReece commented 5 years ago

Hmm, yeah that is strange, I can't see the events firing in my Vue dev tools either.

Your workaround is what I would have suggested. I will look into this in the meantime.

adlaws commented 5 years ago

No worries - thanks for taking the time to check into this!