我正在为我的网络应用程序使用完整日历。在计算机上查看时,我希望它显示整个月份(dayGridMonth)。但在移动设备上查看时,我希望它只显示日期 (dayGridDay)。
我的代码不允许这种情况发生怎么办?
document.addEventListener('DOMContentLoaded', function() {
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
events: 'fetchSchedule.php',
selectable: false,
});
$(window).resize(function() {
if(window.innerWidth < 800){
$('#calendar').fullCalendar('changeView', 'dayGridDay');
} else {
$('#calendar').fullCalendar('changeView', 'dayGridMonth');
}
});
calendar.render();
});
使用 windowResize 触发器。
function( arg: { view } )
当触发 windowResize 时,日历已自动适应新的大小。
$('#calendar').fullCalendar({
windowResize: (arg) => { // your code}
});