PrimeReact 10.1.1 TreeTable组件onToggle函数event.value异常求助

架构老林

2026-7-5

解决方案：PrimeReact 10.1.1 TreeTable onToggle event.value 显示 {undefined: true}

针对你遇到的问题，以下是几个可行的排查和解决方向：

指定数据唯一标识字段
TreeTable 默认使用 id 作为行数据的唯一键，如果你的 monitoringStore.periods 数据中没有 id 字段，或者唯一键是其他名称（比如 periodId），就会导致组件无法识别行，进而出现 undefined 的键值。解决方法是给 TreeTable 添加 dataKey 属性，指定你的数据唯一键：
```
<TreeTable
    value={monitoringStore.periods}
    dataKey="periodId" // 替换成你数据中的唯一键字段名
    // 其他属性...
>
```
避免 onToggle 与单一行展开/折叠事件混用
当同时配置 onToggle 和 onRowExpand/onRowCollapse 时，两个事件的逻辑可能产生冲突，导致 onToggle 的参数异常。可以先暂时移除 onRowExpand 和 onRowCollapse，只保留 onToggle 测试是否恢复正常：
```
<TreeTable
    value={monitoringStore.periods}
    // 移除 onRowExpand 和 onRowCollapse
    onToggle={(e) => onToggle(e)}
    expandedRows={expandedRows}
    // 其他属性...
>
```
确认 expandedRows 初始状态类型
确保 expandedRows 的初始状态是空对象，而不是 undefined 或其他类型，否则组件更新时可能出现参数异常：
```
const [expandedRows, setExpandedRows] = useState({});
```
检查自定义展开列的实现
你使用的 getExpandColumn 函数返回的展开列是否正确绑定了行数据的唯一键？比如展开列的渲染逻辑是否正确读取了行的标识字段，而不是错误地传递了 undefined。可以打印 getExpandColumn 返回的内容，确认列配置中的 rowData 引用是否正确。