Emit an event when the view switches

[Swieckowski]

Hey, I want to use different event titles depending on the view, and figured the best way to do it is send a different array with the titles changed in them, but I would need to trigger this on view change.

If you know of a better way to accomplish without any new features in your codebase I'm totally open to that.

Thanks

[BrockReece]

Have you seen the viewRender callback that is triggered when a new date-range is rendered, or when the view type switches?

[Swieckowski]

Thanks, that solved my issue. Though now I'm having a problem with the scrollTime option not working if my defaultView is agendaWeek. It works ok if I switch between views, though. Any tips for that?

[Swieckowski]

It also works if I go to the view through a vue-router link, but if I enter through a refresh or a direct url scrollTime isn't working.

[BrockReece]

Hi @Swieckowski Sorry for the delay on that, I am afraid I don't have any tips for this, did you figure this out in the end?

[steven87vt]

@Swieckowski Two things to look into:

1) If your using keep alive your parent component may actually be destorying the vue full calendar instance. I ran into this using keep alive on routes. The child components get destoryed in my system when someone logs out probably because on sign in the route changes and the child component loses context. If thats happens vue-fullcalendar will create/mount again and the reference will change. Make sure your not storing the this.$refs.calendar locally and that any of your event handlers are on an old reference of the vue-fullcalendar.

2) I have noticed that working inside event handlers sometimes requires to get outside of the event handler in order for actions to take place. Sometimes its necessary to trigger a data change and fire off an event to change something fullcalendar.io related in a method via nextTick

onChange(){
    if(something) operateNormally();
    else {
       this.$nextTick(() => {
          this.shiftData(); //simply to get a synchronized reload of the fullcalendar.io after this event completes
          this.$refs.calendar.fireMethod('scrollTime', this.config.scrollTime);
       });
   }
}

methods: ...
  shiftData() {
    let first = this.events.shift();
    this.events.push(first); 
  }