我正在使用vue-fullcalendar,它是FullCalendar库的包装器。我已经设置了日历并且工作正常,但是我很快就导入了Scheduler,这是一个附加组件,它提供了FullCalendar功能来显示资源,我在日历中的每个日期旁边都有“未定义”(正如你所看到的)图片)。
我在stackoverflow上找到了关于这个问题的两篇文章:
这是我正在使用的代码:
<template>
<div>
<full-calendar
ref="calendar"
:events="events"
:config="config"
>
</full-calendar>
</div>
</template>
<script>
import * as moment from 'moment'
import {FullCalendar} from 'vue-full-calendar'
import 'fullcalendar/dist/fullcalendar.min.css'
import 'fullcalendar-scheduler'
import "fullcalendar-scheduler/dist/scheduler.min.css"
export default {
data() {
return {
config: {},
events: [
{
id: 1,
title: 'Title',
start: moment().add(2, 'd').add(2, 'h'),
end: moment().add(2, 'd').add(4, 'h'),
resourceId: 'a'
}
]
}
},
methods: {},
components: {
FullCalendar
}
}
</script>
将此添加到您的FullCalendar配置中,未定义将从标题中条带化
viewRender: function(view, element) {
$('.fc-center')[0].children[0].innerText = view.title.replace(new RegExp("undefined", 'g'), "");
}
如果您使用vue更好地从'jquery'导入*作为$;