vue-full-calendar修改侧栏时间间隔slotDuration【亲测有效】

做项目遇到一个需求，使用vue-full-calendar来做排版表，其中有一个就是要修改侧栏的时间间隔，例如：30分钟的时间间隔，改成10分钟等。
解决方式：
1、销毁后，重新创建

$('#mycalendar').fullCalendar('destroy');
$('#mycalendar').fullCalendar(calendarOptions);

这种销毁后重新创建的方式也是可以做的，但是日历记录的信息都会初始化，也就是默认时间又会从当前周开始，这样你就永远没法跳转到下一周去。

2、重新设置 options配置项

$('#cc-calendar').fullCalendar('option','slotDuration','00:10:00');

以上是使用jquery的方法。

使用VUE的方法如下：
1、销毁后，重新创建

this.$refs.calendar.fireMethod('destroy');// 销毁排班表
this.$refs.calendar.fireMethod(this.config);// 重新创建排班表

2、重新设置option配置项

this.$refs.calendar.fireMethod('option','slotDuration','00:10:00');

这样就可以实现切换了：
原来：

点击切换：

TIPS:

// 这样能够调取 calendar 的下一周的数据
// https://juejin.im/entry/5ab59faa5188252c32199f91
this.$refs.calendar.fireMethod('next');

参考文档：
http://www.maomikeji.cn
https://www.e-learn.cn/content/wangluowenzhang/700989
https://fullcalendar.io/docs/dynamic-options
https://juejin.im/entry/5ab59faa5188252c32199f91
https://www.npmjs.com/package/vue-full-calendar
https://stackoverflow.com/questions/26976079/fullcalendar-set-slotduration-not-working
https://www.helloweba.net/javascript/447.html#fc-destroy