FullCalendar Event数据回显

FullCalendar 官方网站   https://fullcalendar.io/

公司新项目做了一个，有一个排班功能。为了能够明显的显示每天有哪些人工作，百度了一番，选择了这个插件。

讲一下使用总遇到的坑，之前在百度中发布的文章中有介绍各种使用方法，但是现在不知道是怎么回事，可能是应为更行了吧现在好像不能使用了，比如下面这段代码

$('#calendar').fullCalendar({
      header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
      },
      defaultDate: '2018-03-12',
      navLinks: true, // can click day/week names to navigate views
      selectable: true,
      locale:'zh-cn',
      selectHelper: true
});
————————————————
版权声明：本文为CSDN博主「衣襟晚照」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/kylinregister/article/details/82988517

当我使用这个方式来进行初始化的时候回提示一个错误

 

官方最新的初始化方式是

 

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

        var calendar = new FullCalendar.Calendar(calendarEl, {
          plugins: [ 'dayGrid' ]
        });

        calendar.render();
      });

最后直接一点如何渲染数据 

官方文档给出了一个示例  大家基本能看懂

 events: {
    url: '/myfeed.php',
    method: 'POST',
    extraParams: {
      custom_param1: 'something',
      custom_param2: 'somethingelse'
    },
    failure: function() {
      alert('there was an error while fetching events!');
    },
    color: 'yellow',   // a non-ajax option
    textColor: 'black' // a non-ajax option
  }

给出一个我目前的代码（非详细，其他属性自己添加）

document.addEventListener('DOMContentLoaded', function () {
        var calendarEl = document.getElementById('calendar');
        var calendar = new FullCalendar.Calendar(calendarEl, {
            plugins: ['interaction', 'dayGrid', 'timeGrid'],
            header: {
                left: '',
                center: 'title',
                right: '月'
            },
            defaultDate: '2019-11-22',
            navLinks: true, // can click day/week names to navigate views
            selectable: true,
            selectMirror: true,
            locale: 'zh-cn',
            select: function (arg) {
                var title = prompt('Event Title:');
                if (title) {
                    calendar.addEvent({
                        title: title,
                        start: arg.start,
                        end: arg.end,
                        allDay: arg.allDay
                    })
                }
                calendar.unselect()
            },
            editable: true,
            eventLimit: true, // allow "more" link when too many events
            events: {  // 请求数据库数据，获取json数据
                url: 'www.baidu.com/api/josn', // 你的后端访问地址 直接返回对应格式的json串即可
                type: 'POST',
                data: {},
                error: function () {

                }

            }
        });

        calendar.render();
    });