FullCalendar事件加载报错：Uncaught ReferenceError: type_damage未定义

错误原因 #

你在拼接日历事件标题和设置开始时间时，直接使用了type_damage、first_name、last_name、date_event这些未定义的变量。这些值应该是接口/api/v1/eventjobs返回的每条数据里的字段，必须从循环的当前数据项（代码里的v）中读取。

修复方案 #

1. 修正变量引用：把所有未定义的变量替换为v.字段名的形式，确保字段名和接口返回的JSON结构完全一致。
2. 初始化空数组：把var source = [{}];改成var source = [];，避免初始的空对象导致日历出现无效事件。
3. 可选：增加字段校验：如果接口可能返回缺失字段的情况，加简单判断避免报错。

修改后的完整代码 #

events: function(fetchInfo, successCallback, failureCallback) {
    var source = []; // 初始化空数组
    $.ajax({
        url: "/api/v1/eventjobs?tipo=4",
        method: "GET",
        headers: {
            Authorization: "Bearer XcsxcTYXjSW_kHCXgvAWfRC-GYlP0-WyvVOy4Z0jpfo",
            "Content-Type": "application/json",
        },
        dataType: 'json',
        success: function(response) {
            $(response).each(function(e, v) { 
                // 从当前数据项v中读取字段，确保字段名和接口返回一致
                var title = (v.type_damage || '') + ' ' + (v.first_name || '') + ' ' + (v.last_name || '');
                source.push({
                    title: title.trim(), // 去除首尾空格
                    start: v.date_event,
                    color: '#25427e'
                });
            });
            successCallback(source);
        },
        error: function(xhr, status, error) {
            failureCallback(error); // 处理请求失败的情况
        }
    });
}

注意事项 #

• 确认接口返回的每条数据中确实包含type_damage、first_name、last_name、date_event这些字段，如果字段名不一致，要改成接口实际返回的键名。
• 新增了error回调处理请求失败的情况，避免请求出错时日历无响应。

内容的提问来源于stack exchange，提问作者Goyo Webinfinitech