我正在使用 Bootstrap 4 選項卡，在第二個選項卡上我想使用該FullCalendar庫顯示日歷。我使用的 FullCalendar 版本是5.2.0. 如果日歷顯示在第一個選項卡上，它就可以正常工作，因為它沒有隱藏；但是，當它是第二個選項卡的一部分時，它不會加載。我試圖通過在用戶單擊第二個選項卡時觸發 JavaScript 事件單擊來解決此問題?；旧?，我嘗試在用戶單擊選項卡后呈現日歷，但沒有成功。這是我的代碼：<!-- Tabs --><div class="container-fluid">    <div class="container-fluid">        <ul class="nav nav-tabs">            <li class="nav-item">                <a class="nav-link active" data-toggle="tab" href="#today">Today</a>            </li>            <li class="nav-item">                <a class="nav-link" id="calendarButton" data-toggle="tab" href="#week">Week</a>            </li>        </ul>    </div></div><!-- Tabs Content --><div class="tab-content">    <!-- Appointments -->    <div class="tab-pane container" id="today">        <p> Appointments </p>    </div>    <!-- Weekly Calendar -->    <div class="tab-pane container" id="week">        <div class="container-fluid" id="calendar"></div>    </div></div><script>    document.addEventListener('DOMContentLoaded', function() {        var calendarButton = document.getElementById('calendarButton');        var calendarEl = document.getElementById('calendar');        var calendar = new FullCalendar.Calendar(calendarEl, {          themeSystem: 'bootstrap',          headerToolbar: {            right: 'listWeek'          },          events: [                        {% for appointment in appointments %}                        {                            title: "{{ appointment.name}}",                            start: '{{ appointment.start }}',                            end: '{{ appointment.end }}',                        },                        {% endfor %}                   ]        });        calendarButton.addEventListener('click', e => {            calendar.render();        });    });</script>單擊第二個選項卡后如何加載日歷？