fullcalendar-scheduler event-selected problem

[PhilMDev]

When using fullcalendar the @event-selected="" works just fine. However, when you're using fullcalendar-scheduler it appears to be ignored. I didn't bother to search through the code but I never saw an error, etc. If you add:

eventClick: function (event, jsEvent, view) {
  console.log('event clicked')
}

to the config section in data you can get a response. So, it's obviously working internally in scheduler. I wanted to execute a function in methods but kept getting "function not defined." Tried using "this" but that didn't work either.

My solution was to add the following code to the mounted section:

let self = this
let cal = this.$refs.calendar.fireMethod('getCalendar')
cal.on('eventClick', function (event, jsEvent, view) {
  console.log('clicked on: ', event)
  self.doEventClick(event, jsEvent, view)
})

My routine is doEventClick.

I doubt there's anything you can do. I went back to your code and it looks fine. And, again, it works perfectly with the standard fullcalendar. It's just a problem with scheduler. I just wanted to add this so that if someone else has the same problem they don't have to work two or three days to figure out the solution!

Thanks for all your work.

[BrockReece]

Hi @PhilMDev thanks for your message.

Is this just a scoping issue on the eventClick listener you added to the config? If you were to use an arrow function does this fix this issue?

eventClick: (event, jsEvent, view) => {
  console.log(this) // should be your Vue component
}

[PhilMDev]

@BrockReece

You are absolutely right!! I learn more every day. I use fat arrows but I keep forgetting that one of the issues it solves is the "this" issue. Thank you so much!

[BrockReece]

Awesome