fullcalendar - Fullcalendar 不显示事件列表

Question

我正在使用 fullcalendar 在选项卡窗格中显示事件列表：

HTML：

<div class="tab-pane fade" id="events" role="tabpanel" aria-labelledby="events-tab">
    <div class="card">
        <div class="card-header">
            <h3 class="card-title">Events</h3>
        </div>
        <div class="card-body">
            <div id="cal_event_list"></div>                
        </div>
    </div>
</div>

JS：

        document.addEventListener('DOMContentLoaded', function () {
        var calendarEl = document.getElementById('cal_event_list');
        var calendar = new FullCalendar.Calendar(calendarEl, {
            initialView: 'listWeek',
            events: '@Url.Action("CalEventsList/" + Model.ClientID, "Home")'
        });
        calendar.render();
    });

当我切换到选项卡时它会显示这个：

调整浏览器窗口大小后：

有没有人有任何提示来解决这个问题？

谢谢

标签： fullcalendar

Answer 1

通过添加高度解决了这个问题：

        document.addEventListener('DOMContentLoaded', function () {
        var calendarEl = document.getElementById('cal_event_list');
        var calendar = new FullCalendar.Calendar(calendarEl, {
            initialView: 'listWeek',
            height: 600,