全日历自定义视图点击事件

Sim*_*ann 5 fullcalendar fullcalendar-5

我正在使用 fullcalendar 5 并根据文档创建了自定义视图

在五月份的日历配置中,我添加了它,eventClick: (info) => this.displayDetail(info)它与默认视图配合得很好,但无法弄清楚如何从我的自定义视图触发 eventClick

怎么才能触发呢。

自定义视图配置:

import { sliceEvents, createPlugin } from '@fullcalendar/core'

const CustomViewConfig = {
  classNames: ['list-view'],
  duration: {
    month: 1.5
  },
  buttonText: 'Planning',

  content (props, element) {
    let html = '<div class="row">'
    const events = sliceEvents(props, false)

    for (const event of events) {
      html += `
            <div class="col-12 col-md-6 event color-${event.def.sourceId}">
                <div class="row mb-4">
                    <div class="col-4">
                        <div class="col-date">
                            <span>${event.range.start.getDate()} ${event.range.start.toLocaleString('default', { month: 'long' })}</span>
                            <span>${event.range.end.getDate()} ${event.range.end.toLocaleString('default', { month: 'long' })}</span>
                        </div>
                    </div>
                    <div class="col-8">
                      <div class="col-content">
                          ${event.def.title}
                      </div>
                    </div>
                </div>
            </div>
      `
    }

    html += '</div>'

    return { html: html }
  }
}

export default createPlugin({
  views: {
    custom: CustomViewConfig
  }
});
Run Code Online (Sandbox Code Playgroud)