FullCalendar 列表视图 - 如何隐藏 "all-day"

Question

我有一个全日历列表视图。

视图中的所有条目将始终是 "all day" 事件。因此，我真的不需要左栏中出现的 "all-day" 。有没有办法将其从列表中删除？

$(document).ready(

  function() {

    var calendarEl = document.getElementById('date_list');

    var calendar = new FullCalendar.Calendar(calendarEl, {
        plugins: [ 'list' ],
        defaultView: 'listThirtyDay',
        height: 'auto',
        views: {
            listThirtyDay: {
                type: 'list',
                duration: { days: 30 },
                buttonText: '30 days'
            },
            listDay: { buttonText: 'Day' },
            listWeek: { buttonText: 'Week' }
        },
        header: {
            left: 'prev,next',
            center: 'title',
            right: 'listDay,listWeek,listThirtyDay',
        },
        time: false,
        eventSources: [
            {
                url: $('.KeyDatesURL').val()
            }
        ]
    });
    calendar.render();      
  } 
);

Answer 1

你可以使用这个：

allDaySlot: false

在此处查看此 link - https://fullcalendar.io/docs/allDaySlot

你也可以参考这个：

Answer 2

如果您使用浏览器的开发人员工具检查呈现的 HTML 元素，您会看到列表视图中的时间文本保存在 HTML 元素中，并且带有 class "fc-list-item-time".

因此您可以设置一个简单的 CSS 规则来隐藏它：

.fc-list-item-time {
  display:none;
}

现场演示：https://codepen.io/ADyson82/pen/GRJByop

FullCalendar 列表视图 - 如何隐藏 "all-day"

FullCalendar list view - how to hide "all-day"

javascript

html

css

fullcalendar

fullcalendar-4