我正在尝试使用Laravel API + Vue在FullCalendar中呈现事件。
在Vue中,我有以下代码:
<FullCalendar
ref="fullCalendar"
class="calendar"
default-view="dayGridMonth"
:header="{
left: 'title',
center: '',
right: 'prev,next today',
}"
:plugins="calendarPlugins"
:weekends="calendarWeekends"
:events="calendarEvents"
locale="it"
:firstDay="1"
@dateClick="handleDateClick"
@eventClick="handleEventEdit"
/>
...
components: {
FullCalendar,
},
data: function() {
return {
calendarPlugins: [
dayGridPlugin,
interactionPlugin,
],
editable: true,
calendarWeekends: true,
calendarEvents: this.elist,
eventFormVisible: false,
elist: [],
};
},
...
created() {
this.getElist();
},
methods: {
async getElist() {
this.Equery.user_id = this.userId;
this.elist = await eventResource.list(this.Equery); // http://mysite.test/api/events?user_id=1
this.elist = this.elist.data;
},
...
API响应似乎正确:
{"data":[{"id":2,"user_id":1,"job_id":null,"job":"2018-090-01","title":"2018-090-01 : 2","hours":2,"start":"2019-11-06T00:00:00+0000","end":"2019-11-06T00:00:00+0000"},{"id":3,"user_id":1,"job_id":null,"job":"2018-090-01","title":"2018-090-01 : 1","hours":1,"start":"2019-11-29T00:00:00+0000","end":"2019-11-29T00:00:00+0000"}]}
但事件未加载
出于调试目的,我尝试:
calendarEvents: 'https://fullcalendar.io/demo-events.json'
它有效! 我找不到错误,需要帮助。 预先感谢。