Angular中FullCalendar v4修改事件DOM触发TS2322类型不匹配问题

报错本质是FullCalendar v4的eventRender回调签名规则和v3及更早版本的写法完全不兼容，叠加Angular项目默认开启的严格TypeScript类型校验，直接触发TS2322类型不匹配错误。
具体不匹配点包括：

• v4版本开始，所有渲染类回调统一将所有关联属性聚合为单个入参对象，不再拆分event、el为两个独立传参
• 你手动声明的双参数(event: any, el: any) => void函数签名，不符合官方类型定义要求的单参数结构，TypeScript按严格规则校验时，会判定多形参的函数无法适配仅传入1个参数的调用场景，直接报赋值错误
• 你感知到问题仅在Angular环境触发，本质是Angular项目默认的tsconfig配置开启了strictFunctionTypes严格函数类型校验，非严格模式的项目会跳过这类函数签名的不匹配检查，仅在运行时暴露DOM操作报错，不会在编译阶段抛出TS2322
• 你在回调中调用的el.find()是jQuery专属方法，但v4原生返回的el是标准HTMLElement实例，本身不存在该方法，即便绕过类型检查，运行时也会抛出方法不存在的错误

1. 对齐官方回调签名
   移除拆分的两个入参写法，改为接收单个参数对象，从对象中解构取出需要使用的event、el属性，匹配官方类型定义的结构要求
2. 替换非兼容的DOM操作
   用原生DOM API替代依赖jQuery的find()方法，实现同样的元素选择、删除、追加逻辑
3. 移除手动标注的全any类型
   不要手动给回调参数标注any，利用TypeScript从OptionsInput类型推导出来的准确入参类型，避免类型校验漏检

// 错误的旧版兼容写法（仅v3及更早版本生效，v4会触发TS2322）
eventRender: (event: any, el: any) => {
  el.find('.fc-title').remove();
  el.find('.fc-time').remove();
  el.append(`<div>${event.extendedProps.description}</div>`);
}

// 正确的v4兼容写法
eventRender: (arg) => {
  // 从入参对象中解构所需属性，类型自动推导
  const { el, event } = arg;
  
  // 用原生API替代jQuery find()
  el.querySelector('.fc-title')?.remove();
  el.querySelector('.fc-time')?.remove();

  // 自定义内容追加逻辑
  const descNode = document.createElement('div');
  descNode.innerText = event.extendedProps?.description || '';
  el.appendChild(descNode);
}

• 自定义回调逻辑时务必使用箭头函数形式，避免this指向丢失，保证回调中可以正常访问组件类的属性和方法
• 若项目仍依赖jQuery的选择器能力，不要直接在原生el实例上调用jQuery方法，需先将el传入jQuery构造函数做包装：$(el).find('.fc-title')，该写法会被类型系统识别为非兼容操作，不建议在严格模式项目中使用
• 无需额外安装@fullcalendar/jquery-integration适配包，原生DOM API已经可以覆盖所有自定义事件DOM的修改需求

内容的提问来源于stack exchange，提问作者Jumar Juaton