Fullcalendar 4.x - 如何在事件中添加唯一的ID?

问题描述 投票:0回答:1

我正在从 全日历V3至V4

这是我的 第三版 编码

$('#calendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    events: [
        {
            id: 'event-1',
            title: 'new evn',
            start: '2019-04-24T08:12:14',
            end: '2019-04-27T22:20:20',
            className: "bg-danger",
            description: 'event-1'
        },
        {
            id: 'event-1',
            title: 'All Day Event',
            start: '2019-02-01T14:30:00',
            end: '2019-02-02',
            className: "bg-danger",
            description: 'event-1'
        },            
    ],
    editable: true,
    eventLimit: true,
});

这是我的 第四版代码

document.addEventListener('DOMContentLoaded', function() {
    var calendarEl = document.getElementById('calendar');

    var calendar = new FullCalendar.Calendar(calendarEl, {
        plugins: [ 'dayGrid', 'timeGrid', 'list', 'interaction' ],
        header: {
            left: 'prev, title, next',
            center: 'dayGridMonth,timeGridWeek,timeGridDay,listWeek',
            right: 'add_event'
        },
        timeZone: 'UTC',
        navLinks: true, // can click day/week names to navigate views
        editable: true,
        eventLimit: true, // allow "more" link when too many events
        selectMirror: true,
        events: [
          {
            id: 'ev-1',
            title: 'All Day Event',
            start: '2019-06-01',
          },
          {
            id: 'ev-2',
            title: 'Long Event',
            start: '2019-06-07',
            end: '2019-06-10'
          },
          {
            id: 'ev-3',
            groupId: 999,
            title: 'Repeating Event',
            start: '2019-06-09T16:00:00'
          },
          {
            id: 'ev-3-1',
            groupId: 999,
            title: 'Repeating Event',
            start: '2019-06-16T16:00:00'
          }

    });

calendar.render();
});

在4版本中不工作

我也已经登记了 文件 在事件模型标题下

现在用groupId来完成。id属性现在应该在日历中的所有事件中是唯一的。

作为 ADyson 问我面临什么问题

以下是最新情况

在第3版中 id 会显示,如果你打开 检验> 元件 就像下面的图片和版本4,它没有显示(即使在你的例子中)。

第三版

enter image description here

第四版

enter image description here

javascript fullcalendar fullcalendar-4 unique-id
1个回答
1
投票

你可以添加自定义id到元素上 eventRender.

//FullCalendar v4
eventRender: function (info) {
    $(info.el).attr('data-custom-id', info.event.id);
},
© www.soinside.com 2019 - 2024. All rights reserved.