渲染含批注的 xlsx 文件时抛出 TypeError: Cannot read properties of undefined (reading 'comments')

[JasperZhongDev]

问题描述

当渲染包含**单元格批注（Comments/Notes）**的 .xlsx 文件时，vue-office/excel 会抛出未捕获的 TypeError，导致表格无法渲染。

TypeError: Cannot read properties of undefined (reading 'comments')
    at @vue-office_excel.js (reconcile, ~line 9918)
    at Array.reduce
    at Array.forEach

根本原因

在内部 reconcile 函数中，代码遍历 worksheet 的 rels，并假设只要存在类型为 Comments 的关联关系，t4.comments 中就一定有对应的批注对象：

n4.Type === s2.Comments && (e4.comments = t4.comments[n4.Target].comments)

当 t4.comments[n4.Target] 为 undefined 时（例如批注 XML 解析失败，或目标路径不匹配），访问其 .comments 属性会直接抛出异常。

复现步骤

1. 用 Excel / WPS 打开任意 .xlsx 文件
2. 在某个单元格添加批注（右键 → 插入批注 / 新建便签）
3. 保存后作为 src 传给 <vue-office-xlsx>
4. 组件触发 @error，表格无法渲染

期望行为

组件应正常渲染表格数据，无法解析的批注应被跳过，不影响整体渲染。

建议修复

在访问 .comments 前增加空值保护：

// 修复前
n4.Type === s2.Comments && (e4.comments = t4.comments[n4.Target].comments)

// 修复后
n4.Type === s2.Comments && t4.comments[n4.Target] && (e4.comments = t4.comments[n4.Target].comments)

环境信息

• @vue-office/excel：最新版
• Vue 3
• 浏览器：Chrome

---