React中Syncfusion TreeGrid能否滚动子行时冻结父行？

这个需求完全可行，基于Syncfusion TreeGrid的现有能力和自定义扩展即可实现，具体实现思路如下：

• 展开父行滚动子行时固定父行
  通过自定义CSS结合TreeGrid的行事件就能实现：

  1. 利用rowDataBound事件识别父行（通过行数据的层级属性，比如level为0），给父行添加专属类名（如sticky-parent-row）。
  2. 给该类名设置CSS样式：position: sticky; top: 0; background: #fff; z-index: 1;，确保父行在滚动子行时固定在视口顶部。
  3. 调整TreeGrid滚动容器的样式，避免sticky定位失效。

• 多父行展开后滚动完子行自动固定下一个父行
  结合滚动事件监听和行位置计算来实现：

  1. 监听TreeGrid滚动容器的scroll事件，实时计算当前滚动位置。
  2. 通过TreeGrid的getRows方法获取所有行元素，筛选出已展开的父行及其对应的子行区域。
  3. 当滚动到某组子行的底部时，移除上一个父行的sticky类，给下一个已展开的父行添加sticky类，实现自动切换固定的效果。

需要注意的细节：

• 处理父行固定时的层级z-index，避免被其他行遮挡。
• 在父行展开/折叠、数据更新时，重新计算行位置和sticky状态，确保交互稳定。
• 可参考Syncfusion官方文档中关于行自定义、滚动事件的示例进行扩展开发。

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