vue.js - FullCalendar VueJS - 更新日期范围
问题描述
我使用官方的FullCalendar VueJS 组件,我想更新视图中显示的当前范围(此处为DayGridMonth):1 个月、2 个月、3 个月、自定义期间
根据“文档”,visibleRange
可以通过该功能setOption()
(https://fullcalendar.io/docs/visibleRange)更新属性,但它对我不起作用:该属性在组件中得到了很好的更新,但是视图没有更新。
我也尝试手动更新状态,但没有结果。
这是我的草稿功能
updateCurrentDate: function () {
const calendarApi = this.$refs.fullCalendar.getApi();
const date = new Date(calendarApi.getDate());
let endRange;
this.currentPeriodRange = calendarApi.state.dateProfile.activeRange;
this.currentPeriodLabel = moment(date).format('MMMM YYYY');
if (this.currentView === 'month') {
endRange = moment(this.currentPeriodRange.start).add(2, 'month');
this.currentPeriodRange.end = endRange.toDate();
// Not working
calendarApi.setOption('visibleRange', this.currentPeriodRange);
// No one of these test work
calendarApi.state.dateProfile.activeRange = this.currentPeriodRange; //
calendarApi.state.dateProfile.currentRange = this.currentPeriodRange;
calendarApi.state.dateProfile.renderRange = this.currentPeriodRange;
}
if (this.currentPeriodRange.start !== this.currentPeriodRange.end) {
this.currentPeriodLabel = this.currentPeriodLabel + ' - ' + endRange.format('MMMM YYYY');
}
return;
},
感谢阅读和回答
解决方案
推荐阅读
- vb.net - 如何在 DataGridViewComboBoxColumn 中添加空白字段
- macos - 尽管使用了 sudo,但打开 /dev/rdisk0 仍会出现“不允许操作”错误
- android - adb 不是内部或外部命令、可运行程序或批处理文件
- java - IGV 在 Mac 上崩溃
- javascript - Vue CLI 3 vue.config.js 与 webpack.config.js 的插件
- linux - Linux 命令 `file` 如何识别我的文件的编码?
- composer-php - 在 OS Catalina 上安装 PHP Composer
- javascript - 无法连接到 SQLEXPRESS - Node.js
- mysql - MySQL 5.7 - 物料清单的总量列
- git - 如何在 JGit 中执行“git clone --mirror”?