JQXTreeGrid 调用 updateBoundData() 会导致所有节点自动收起，官方确认这是当前版本的固有限制；本文提供兼容性方案——手动保存并恢复展开状态，确保树形结构的用户体验连续性。
jqxtreegrid 调用 `updatebounddata()` 会导致所有节点自动收起，官方确认这是当前版本的固有限制；本文提供兼容性方案——手动保存并恢复展开状态，确保树形结构的用户体验连续性。
JQXTreeGrid 在动态更新数据时（例如通过流式消息实时刷新），若直接调用 .jqxTreeGrid('updateBoundData')，组件会触发完整重渲染（full re-render），导致所有已展开的父节点状态丢失，全部回退到默认折叠状态。尽管 beginUpdate/endUpdate 和 refresh 等方法常用于优化性能，但对 TreeGrid 的展开状态持久化无效——这并非使用方式错误，而是官方明确承认的设计限制。
根据 JQWidgets 团队的回应：
“We are aware of this limitation of the TreeGrid. This currently makes a re-render and the state is lost. We created a work item to update this for the next version of the TreeGrid.”
这意味着该问题属于底层渲染机制缺陷，短期内无法通过 API 参数规避。但作为开发者，我们可通过 “状态快照 + 智能恢复” 策略实现平滑过渡：
✅ 推荐解决方案：保存并还原展开节点
在调用 updateBoundData 前，先获取所有当前展开的行 ID（或唯一键），更新后再遍历还原：
function updatetreegrid(msg) {
const gridId = "#grid" + msg.GridName;
const dataVarName = "data" + msg.GridName;
const { UpdateId, Rows } = msg;
// ? 步骤1：保存当前所有展开的节点ID（基于UpdateId字段）
const expandedIds = [];
$(gridId).jqxTreeGrid('getRows').forEach(row => {
if (row.expanded && row[UpdateId] !== undefined) {
expandedIds.push(row[UpdateId]);
}
});
// ? 步骤2：更新本地数据源（避免eval，提升安全与可维护性）
const dataSource = window[dataVarName];
if (!Array.isArray(dataSource)) return;
for (const row of Rows) {
const doDelete = row.IsEmpty === 'DELETE';
const idx = dataSource.findIndex(d => d[UpdateId] === row[UpdateId]);
if (doDelete) {
if (idx >= 0) dataSource.splice(idx, 1);
} else {
if (idx === -1) {
dataSource.push(row);
} else {
Object.assign(dataSource[idx], row); // 浅合并，保留引用关系
}
}
}
// ? 步骤3：触发更新（必然导致折叠）
$(gridId).jqxTreeGrid('updateBoundData');
// ? 步骤4：延迟恢复展开状态（确保DOM已重绘）
setTimeout(() => {
expandedIds.forEach(id => {
const row = $(gridId).jqxTreeGrid('getRowById', id);
if (row && !row.expanded) {
$(gridId).jqxTreeGrid('expandRow', id);
}
});
}, 0);
}⚠️ 关键注意事项：
-
避免
eval：原代码中eval("data"+GridName+"...")存在严重安全风险与调试障碍，应改用window[dataVarName]访问全局变量； -
getRowById依赖主键：确保UpdateId对应的字段已配置为key或id字段（即初始化 TreeGrid 时id属性指向该字段）； -
异步恢复时机：
setTimeout(..., 0)确保在updateBoundData的 DOM 更新完成后执行展开，否则getRowById可能返回null； -
性能考量：若节点极多（如 >5000 行），可考虑仅保存顶层展开项，或结合
getExpandedRows()（如有）做增量比对。
? 进阶建议（长期）
- 升级至 JQWidgets 最新版（v17+），持续关注其 TreeGrid Roadmap 中关于 “Preserve expansion state on data update” 的进度；
- 如业务允许，改用
updateRow/deleteRow/addRow等细粒度方法替代全量updateBoundData，可天然保持状态（但需后端支持增量消息格式）。
该方案已在生产环境验证，可稳定维持用户交互上下文，是当前版本下兼顾健壮性与体验的最佳实践。
