Repository: Tencent/tdesign-react
Pull request #3427: fix(table): fix fixedRows render when using virtual scroll
Author: login: huangchen1031
Created: 2025-03-11T10:03:28Z | Merged: 2025-03-18T08:54:26Z

<!--
首先，感谢你的贡献！😄
请阅读并遵循 [TDesign 贡献指南](https://github.com/Tencent/tdesign/blob/main/docs/contributing.md)，填写以下 pull request 的信息。
PR 在维护者审核通过后会合并，谢谢！
-->

### 🤔 这个 PR 的性质是？

- [x] 日常 bug 修复
- [ ] 新特性提交
- [ ] 文档改进
- [ ] 演示代码改进
- [ ] 组件样式/交互改进
- [ ] CI/CD 改进
- [ ] 重构
- [ ] 代码风格优化
- [ ] 测试用例
- [ ] 分支合并
- [ ] 其他

### 🔗 相关 Issue

<!--
1. 描述相关需求的来源，如相关的 issue 讨论链接。
-->

### 💡 需求背景和解决方案

<!--
1. 要解决的具体问题。
2. 列出最终的 API 实现和用法。
3. 涉及UI/交互变动需要有截图或 GIF。
-->

开始虚拟滚动后，fixedRows不生效：
![Clipboard_Screenshot_1740559232](https://github.com/user-attachments/assets/db628e3b-e9e9-4ad7-8704-f8e99d4f49cc)


修改后：
![Clipboard_Screenshot_1740558451](https://github.com/user-attachments/assets/91112b39-4420-4472-b9ac-70ed16bdf3de)

https://github.com/Tencent/tdesign-react/issues/3422
同步修复这个issue提到的一些问题

### 📝 更新日志

<!--
从用户角度描述具体变化，以及可能的 breaking change 和其他风险。
-->

- fix(table): 开启虚拟滚动时fixedRows的渲染问题

- [ ] 本条 PR 不需要纳入 Changelog

### ☑️ 请求合并前的自查清单

⚠️ 请自检并全部**勾选全部选项**。⚠️

- [x] 文档已补充或无须补充
- [x] 代码演示已提供或无须提供
- [x] TypeScript 定义已补充或无须补充
- [x] Changelog 已提供或无须提供



Diff:
diff --git a/packages/components/hooks/useVirtualScroll.ts b/packages/components/hooks/useVirtualScroll.ts
index ceeefb1994..a1f655cc5b 100644
--- a/packages/components/hooks/useVirtualScroll.ts
+++ b/packages/components/hooks/useVirtualScroll.ts
@@ -8,7 +8,9 @@ import useResizeObserver from './useResizeObserver';
 export type UseVirtualScrollParams = {
   /** 列数据 */
   data: { [key: string]: any }[];
-  scroll: TScroll;
+  scroll: TScroll & {
+    fixedRows?: Array<number>;
+  };
 };
 
 const requestAnimationFrame =
@@ -38,6 +40,7 @@ const useVirtualScroll = (container: MutableRefObject<HTMLElement>, params: UseV
       rowHeight: scroll.rowHeight || 47,
       threshold: scroll.threshold || 100,
       type: scroll.type,
+      fixedRows: scroll.fixedRows ?? [0, 0],
     };
   }, [scroll]);
 
@@ -77,12 +80,27 @@ const useVirtualScroll = (container: MutableRefObject<HTMLElement>, params: UseV
     if (currentIndex < 0) return;
     const startIndex = Math.max(currentIndex - tScroll.bufferSize, 0);
     const endIndex = Math.min(lastIndex + tScroll.bufferSize, trScrollTopHeightList.length);
+
+    // 计算固定行情况
+    const { fixedRows } = tScroll;
+    const [fixedStart, fixedEnd] = fixedRows;
+    let fixedStartData = fixedStart ? data.slice(0, fixedStart) : [];
+    if (fixedStart && startIndex < fixedStart) {
+      fixedStartData = fixedStartData.slice(0, startIndex);
+    }
+    let fixedEndData = fixedEnd ? data.slice(data.length - fixedEnd) : [];
+    const bottomStartIndex = endIndex - data.length + 1 + (fixedEnd ?? 0);
+    if (fixedEnd && bottomStartIndex > 0) {
+      fixedEndData = fixedEndData.slice(bottomStartIndex);
+    }
+
     if (startAndEndIndex.join() !== [startIndex, endIndex].join() && startIndex >= 0) {
-      const tmpVisibleData = data.slice(startIndex, endIndex);
+      const tmpVisibleData = fixedStartData.concat(data.slice(startIndex, endIndex)).concat(fixedEndData);
       setVisibleData(tmpVisibleData);
       const lastScrollTop = trScrollTopHeightList[startIndex - 1];
       const top = lastScrollTop > 0 ? lastScrollTop : 0;
-      setTranslateY(top);
+      const stickyHeight = trScrollTopHeightList[Math.min(startIndex, fixedStart) - 1] || 0;
+      setTranslateY(top - stickyHeight);
       setStartAndEndIndex([startIndex, endIndex]);
     }
   };
@@ -169,13 +187,20 @@ const useVirtualScroll = (container: MutableRefObject<HTMLElement>, params: UseV
       addIndexToData(data);
 
       const scrollTopHeightList = trScrollTopHeightList.current;
-      const lastIndex = scrollTopHeightList.length - 1;
-      setScrollHeight(scrollTopHeightList[lastIndex]);
-
-      const [startIndex, endIndex] = startAndEndIndex;
-      const tmpData = data.slice(startIndex, endIndex);
-
-      setVisibleData(tmpData);
+      if (scrollTopHeightList?.length === data?.length) {
+        // 数据初始化后，根据计算结果更新
+        const lastIndex = scrollTopHeightList.length - 1;
+        setScrollHeight(scrollTopHeightList[lastIndex]);
+
+        updateVisibleData(scrollTopHeightList, container.current.scrollTop);
+      } else {
+        // 数据初始化
+        setScrollHeight(data.length * tScroll.rowHeight);
+
+        const tmpData = data.slice(0, (scroll?.bufferSize || 10) * 3);
+        setVisibleData(tmpData);
+        setTranslateY(0);
+      }
 
       const timer = setTimeout(() => {
         if (container.current) {
diff --git a/packages/components/table/BaseTable.tsx b/packages/components/table/BaseTable.tsx
index a7b37c87b5..6be5c29d43 100644
--- a/packages/components/table/BaseTable.tsx
+++ b/packages/components/table/BaseTable.tsx
@@ -201,7 +201,14 @@ const BaseTable = forwardRef<BaseTableRef, BaseTableProps>((originalProps, ref)
     }, 0);
   };
 
-  const virtualConfig = useVirtualScroll(tableContentRef, { data, scroll: props.scroll });
+  const virtualScrollParams = useMemo(
+    () => ({
+      data,
+      scroll: { ...props.scroll, fixedRows: props.fixedRows },
+    }),
+    [data, props.scroll, props.fixedRows],
+  );
+  const virtualConfig = useVirtualScroll(tableContentRef, virtualScrollParams);
 
   let lastScrollY = -1;
   const onInnerVirtualScroll = (e: WheelEvent<HTMLDivElement>) => {
@@ -274,7 +281,7 @@ const BaseTable = forwardRef<BaseTableRef, BaseTableProps>((originalProps, ref)
     [tableRef],
   );
 
-  useEffect(getTFootHeight, [tableElmRef]);
+  useEffect(getTFootHeight, [tableElmRef, props.footData, props.footerSummary]);
 
   const newData = isPaginateData ? dataSource : data;
 
@@ -417,7 +424,7 @@ const BaseTable = forwardRef<BaseTableRef, BaseTableProps>((originalProps, ref)
         offsetBottom={marginScrollbarWidth || 0}
         {...getAffixProps(props.footerAffixedBottom)}
         ref={footerBottomAffixRef}
-        style={{ marginTop: `${-1 * (tableFootHeight + marginScrollbarWidth)}px` }}
+        style={{ marginTop: `${-1 * ((tableFootHeight || 0) + marginScrollbarWidth)}px` }}
       >
         <div
           ref={affixFooterRef}
@@ -456,7 +463,7 @@ const BaseTable = forwardRef<BaseTableRef, BaseTableProps>((originalProps, ref)
     ellipsisOverlayClassName: props.size !== 'medium' ? sizeClassNames[props.size] : '',
     rowAndColFixedPosition,
     showColumnShadow,
-    data: virtualConfig.isVirtualScroll ? virtualConfig.visibleData : newData,
+    data: newData,
     virtualConfig,
     handleRowMounted: virtualConfig.handleRowMounted,
     columns: spansAndLeafNodes?.leafColumns || columns,
@@ -472,8 +479,7 @@ const BaseTable = forwardRef<BaseTableRef, BaseTableProps>((originalProps, ref)
     ...pick(props, extendTableProps),
     pagination: innerPagination,
   };
-
-  const translate = `translate(0, ${virtualConfig.scrollHeight + affixHeaderHeight + tableFootHeight}px)`;
+  const translate = `translate(0, ${virtualConfig.scrollHeight + (affixHeaderHeight || 0) + (tableFootHeight || 0)}px)`;
   const virtualStyle = {
     transform: translate,
     msTransform: translate,
@@ -523,6 +529,7 @@ const BaseTable = forwardRef<BaseTableRef, BaseTableProps>((originalProps, ref)
             tableContentRef,
             tableWidth,
             isWidthOverflow,
+            virtualConfig,
             props.rowKey,
             props.rowClassName,
             props.rowAttributes,
@@ -647,6 +654,7 @@ const BaseTable = forwardRef<BaseTableRef, BaseTableProps>((originalProps, ref)
       props.footerSummary,
       props.footerAffixedBottom,
       props.rowspanAndColspanInFooter,
+      tableWidth.current,
     ],
   );
 
diff --git a/packages/components/table/TBody.tsx b/packages/components/table/TBody.tsx
index 748ebcad00..7fe885231a 100644
--- a/packages/components/table/TBody.tsx
+++ b/packages/components/table/TBody.tsx
@@ -135,7 +135,10 @@ export default function TBody(props: TableBodyProps) {
       'rowHeight',
       'scrollType',
     ];
-    data?.forEach((row, rowIndex) => {
+
+    const renderData = virtualConfig.isVirtualScroll ? virtualConfig.visibleData : data;
+
+    renderData?.forEach((row, rowIndex) => {
       const trProps = {
         ...pick(props, TABLE_PROPS),
         rowKey: props.rowKey || 'id',
diff --git a/packages/components/table/TR.tsx b/packages/components/table/TR.tsx
index cd165b005a..48871dcf84 100644
--- a/packages/components/table/TR.tsx
+++ b/packages/components/table/TR.tsx
@@ -89,6 +89,7 @@ export default function TR(props: TrProps) {
     fixedRows,
     rowAndColFixedPosition,
     classNames.tableRowFixedClasses,
+    virtualConfig.isVirtualScroll ? virtualConfig.translateY : 0,
   );
 
   const trAttributes = useMemo(
diff --git a/packages/components/table/hooks/useFixed.ts b/packages/components/table/hooks/useFixed.ts
index 0a2458bb47..59609235ea 100644
--- a/packages/components/table/hooks/useFixed.ts
+++ b/packages/components/table/hooks/useFixed.ts
@@ -44,6 +44,8 @@ export function getRowFixedStyles(
   fixedRows: TdBaseTableProps['fixedRows'],
   rowAndColFixedPosition: RowAndColFixedPosition,
   tableRowFixedClasses: TableRowFixedClasses,
+  // 和虚拟滚动搭配使用时，需要增加 style 的偏移量
+  virtualTranslateY = 0,
 ): { style: Styles; classes: ClassName } {
   if (!fixedRows || !fixedRows.length) return { style: undefined, classes: undefined };
   const fixedTop = rowIndex < fixedRows[0];
@@ -57,8 +59,8 @@ export function getRowFixedStyles(
     [tableRowFixedClasses.withoutBorderBottom]: rowIndex === firstFixedBottomRow - 1,
   };
   const rowStyles = {
-    top: fixedTop ? `${fixedPos.top}px` : undefined,
-    bottom: fixedBottom ? `${fixedPos.bottom}px` : undefined,
+    top: fixedTop ? `${fixedPos.top - virtualTranslateY}px` : undefined,
+    bottom: fixedBottom ? `${fixedPos.bottom + virtualTranslateY}px` : undefined,
   };
   return {
     style: rowStyles,
diff --git a/test/snap/__snapshots__/csr.test.jsx.snap b/test/snap/__snapshots__/csr.test.jsx.snap
index 2b759199cd..a9d7e29c25 100644
--- a/test/snap/__snapshots__/csr.test.jsx.snap
+++ b/test/snap/__snapshots__/csr.test.jsx.snap
@@ -59635,7 +59635,7 @@ exports[`csr snapshot test > csr test packages/components/list/_example/virtual-
         style="height: 300px; position: relative;"
       >
         <div
-          style="position: absolute; width: 1px; height: 1px; transition: transform 0.2s; transform: translate(0, undefinedpx);"
+          style="position: absolute; width: 1px; height: 1px; transition: transform 0.2s; transform: translate(0, 240000px);"
         />
         <ul
           class="t-list__inner"
@@ -137604,9 +137604,9 @@ exports[`ssr snapshot test > ssr test packages/components/table/_example/style.t
 
 exports[`ssr snapshot test > ssr test packages/components/table/_example/tree.tsx 1`] = `"<div style="gap:16px" class="t-space t-space-vertical"><div class="t-space-item"><div style="gap:16px" class="t-space t-space-horizontal"><div class="t-space-item"><button type="button" class="t-button t-button--theme-primary t-button--variant-base"><span class="t-button__text">添加根节点</span></button></div><div class="t-space-item"><button style="margin-left:16px" type="button" class="t-button t-button--theme-default t-button--variant-base"><span class="t-button__text">重置/更新数据</span></button></div><div class="t-space-item"><button style="margin-left:16px" type="button" class="t-button t-button--theme-default t-button--variant-base"><span class="t-button__text">展开/收起可见行</span></button></div><div class="t-space-item"><button style="margin-left:16px" type="button" class="t-button t-button--theme-default t-button--variant-base"><span class="t-button__text">展开全部</span></button></div><div class="t-space-item"><button style="margin-left:16px" type="button" class="t-button t-button--theme-default t-button--variant-base"><span class="t-button__text">获取全部树形结构</span></button></div></div></div><div class="t-space-item"><label tabindex="0" class="t-checkbox" style="vertical-align:middle"><input type="checkbox" class="t-checkbox__former" tabindex="-1"/><span class="t-checkbox__input"></span><span class="t-checkbox__label">自定义折叠/展开图标</span></label></div><div class="t-space-item"><div class="t-table t-table--row-handler-draggable" style="position:relative"><div class="t-table__content"><table class="t-table--layout-fixed"><colgroup><col style="width:46px"/><col style="width:80px"/><col style="width:180px"/><col style="width:100px"/><col style="width:340px"/></colgroup><thead class="t-table__header"><tr><th data-colkey="drag" class="t-table__th-drag t-align-center"><div class="t-table__th-cell-inner">排序</div></th><th data-colkey="id" class="t-table__th-id"><div class="t-table__th-cell-inner"><div class="t-table__ellipsis t-text-ellipsis">编号</div></div></th><th data-colkey="key" class="t-table__th-key"><div class="t-table__th-cell-inner"><div class="t-table__ellipsis t-text-ellipsis">名称</div></div></th><th data-colkey="platform" class="t-table__th-platform"><div class="t-table__th-cell-inner">签署方式</div></th><th data-colkey="operate" class="t-table__th-operate t-align-center"><div class="t-table__th-cell-inner">操作</div></th></tr></thead><tbody class="t-table__body"><tr data-id="申请人 0_1 号" class=""><td class="t-align-center t-table__handle-draggable"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-move"><path fill="currentColor" d="M6.75 2.25h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3z"></path></svg></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis">0</div></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis"><div class="t-table__tree-col t-table__tree-col--inline">申请人 0_1 号</div></div></td><td class="">电子签署</td><td class="t-align-center"><div class="tdesign-table-demo__table-operations"><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">插入</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">前插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">后插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">更新</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">查看</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">删除</a></div></td></tr><tr data-id="申请人 1_1 号" class=""><td class="t-align-center t-table__handle-draggable"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-move"><path fill="currentColor" d="M6.75 2.25h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3z"></path></svg></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis">1</div></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis"><div class="t-table__tree-col t-table__tree-col--inline"><span class="t-table__tree-op-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add-rectangle"><path fill="currentColor" d="M2 2h20v20H2V2zm2 2v16h16V4H4zm9 2.5V11h4.5v2H13v4.5h-2V13H6.5v-2H11V6.5h2z"></path></svg></span>申请人 1_1 号</div></div></td><td class="">纸质签署</td><td class="t-align-center"><div class="tdesign-table-demo__table-operations"><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">插入</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">前插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">后插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">更新</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">查看</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">删除</a></div></td></tr><tr data-id="申请人 2_1 号" class=""><td class="t-align-center t-table__handle-draggable"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-move"><path fill="currentColor" d="M6.75 2.25h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3z"></path></svg></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis">2</div></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis"><div class="t-table__tree-col t-table__tree-col--inline"><span class="t-table__tree-op-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add-rectangle"><path fill="currentColor" d="M2 2h20v20H2V2zm2 2v16h16V4H4zm9 2.5V11h4.5v2H13v4.5h-2V13H6.5v-2H11V6.5h2z"></path></svg></span>申请人 2_1 号</div></div></td><td class="">电子签署</td><td class="t-align-center"><div class="tdesign-table-demo__table-operations"><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">插入</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">前插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">后插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">更新</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">查看</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">删除</a></div></td></tr><tr data-id="申请人 3_1 号" class=""><td class="t-align-center t-table__handle-draggable"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-move"><path fill="currentColor" d="M6.75 2.25h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3z"></path></svg></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis">3</div></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis"><div class="t-table__tree-col t-table__tree-col--inline"><span class="t-table__tree-op-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add-rectangle"><path fill="currentColor" d="M2 2h20v20H2V2zm2 2v16h16V4H4zm9 2.5V11h4.5v2H13v4.5h-2V13H6.5v-2H11V6.5h2z"></path></svg></span>申请人 3_1 号</div></div></td><td class="">纸质签署</td><td class="t-align-center"><div class="tdesign-table-demo__table-operations"><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">插入</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">前插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">后插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">更新</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">查看</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">删除</a></div></td></tr><tr data-id="申请人 4_1 号" class=""><td class="t-align-center t-table__handle-draggable"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-move"><path fill="currentColor" d="M6.75 2.25h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3z"></path></svg></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis">4</div></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis"><div class="t-table__tree-col t-table__tree-col--inline"><span class="t-table__tree-op-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add-rectangle"><path fill="currentColor" d="M2 2h20v20H2V2zm2 2v16h16V4H4zm9 2.5V11h4.5v2H13v4.5h-2V13H6.5v-2H11V6.5h2z"></path></svg></span>申请人 4_1 号</div></div></td><td class="">电子签署</td><td class="t-align-center"><div class="tdesign-table-demo__table-operations"><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">插入</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">前插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">后插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">更新</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">查看</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">删除</a></div></td></tr><tr data-id="申请人懒加载节点 66666，点我体验" class=""><td class="t-align-center t-table__handle-draggable"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-move"><path fill="currentColor" d="M6.75 2.25h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3z"></path></svg></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis">66666</div></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis"><div class="t-table__tree-col t-table__tree-col--inline"><span class="t-table__tree-op-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add-rectangle"><path fill="currentColor" d="M2 2h20v20H2V2zm2 2v16h16V4H4zm9 2.5V11h4.5v2H13v4.5h-2V13H6.5v-2H11V6.5h2z"></path></svg></span>申请人懒加载节点 66666，点我体验</div></div></td><td class="">电子签署</td><td class="t-align-center"><div class="tdesign-table-demo__table-operations"><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">插入</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">前插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">后插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">更新</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">查看</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">删除</a></div></td></tr><tr data-id="申请人懒加载节点 88888，点我体验 " class=""><td class="t-align-center t-table__handle-draggable"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-move"><path fill="currentColor" d="M6.75 2.25h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3z"></path></svg></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis">88888</div></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis"><div class="t-table__tree-col t-table__tree-col--inline"><span class="t-table__tree-op-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add-rectangle"><path fill="currentColor" d="M2 2h20v20H2V2zm2 2v16h16V4H4zm9 2.5V11h4.5v2H13v4.5h-2V13H6.5v-2H11V6.5h2z"></path></svg></span>申请人懒加载节点 88888，点我体验 </div></div></td><td class="">电子签署</td><td class="t-align-center"><div class="tdesign-table-demo__table-operations"><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">插入</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">前插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">后插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">更新</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">查看</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">删除</a></div></td></tr></tbody></table></div><div class="t-table__pagination-wrap" style="opacity:1"><div class="t-table__pagination"><div class="t-pagination"><div class="t-pagination__total">Total 100 items</div><div class="t-pagination__select"><div class="t-select__wrap"><div class="t-select t-select-input t-select-input--empty"><div class="t-input__wrap t-input--auto-width" spellcheck="false"><div class="t-input t-is-readonly t-align-left t-input--suffix"><input placeholder="please select" type="text" class="t-input__inner" readonly="" value=""/><span class="t-input__input-pre">please select</span><span class="t-input__suffix t-input__suffix-icon"><svg class="t-fake-arrow t-select__right-icon" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path></svg></span></div></div></div></div></div><div class="t-pagination__btn t-pagination__btn-prev t-is-disabled"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-left"><path fill="currentColor" d="M15.91 17.5l-5.5-5.5 5.5-5.5-1.41-1.41L7.59 12l6.91 6.91 1.41-1.41z"></path></svg></div><ul class="t-pagination__pager"><li class="t-pagination__number t-is-current">1</li><li class="t-pagination__number">2</li><li class="t-pagination__number">3</li><li class="t-pagination__number">4</li><li class="t-pagination__number">5</li><li class="t-pagination__number">6</li><li class="t-pagination__number">7</li><li class="t-pagination__number">8</li><li class="t-pagination__number">9</li><li class="t-pagination__number">10</li></ul><div class="t-pagination__btn t-pagination__btn-next"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right"><path fill="currentColor" d="M8.09 17.5l5.5-5.5-5.5-5.5L9.5 5.09 16.41 12 9.5 18.91 8.09 17.5z"></path></svg></div></div></div></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test packages/components/table/_example/tree-select.tsx 1`] = `"<div style="gap:16px" class="t-space t-space-vertical"><div class="t-space-item"><div style="gap:16px" class="t-space t-space-horizontal"><div class="t-space-item"><div class="t-radio-group t-size-m t-radio-group--filled"><label tabindex="0" class="t-radio-button"><input type="radio" class="t-radio-button__former" tabindex="-1" data-value="true" value="1"/><span class="t-radio-button__input"></span><span class="t-radio-button__label">父子行选中独立</span></label><label tabindex="0" class="t-radio-button t-is-checked" checked=""><input type="radio" class="t-radio-button__former" tabindex="-1" data-value="false" checked="" value="0"/><span class="t-radio-button__input"></span><span class="t-radio-button__label">父子行选中关联</span></label><div class="t-radio-group__bg-block"></div></div></div><div class="t-space-item"><button type="button" class="t-button t-button--theme-primary t-button--variant-base"><span class="t-button__text">获取树形结构展开的节点</span></button></div><div class="t-space-item"><button type="button" class="t-button t-button--theme-primary t-button--variant-base"><span class="t-button__text">滚动到指定元素</span></button></div></div></div><div class="t-space-item"><div class="t-table" style="position:relative"><div class="t-table__content" style="height:300px"><div class="t-table__virtual-scroll-cursor" style="transform:translate(0, 0px);-ms-transform:translate(0, 0px);-moz-transform:translate(0, 0px);-webkit-transform:translate(0, 0px)"></div><table class="t-table--layout-fixed t-table--full-height"><colgroup><col style="width:46px"/><col style="width:50px"/><col style="min-width:80px"/><col style="min-width:80px"/><col style="min-width:80px"/><col style="min-width:80px"/></colgroup><thead class="t-table__header t-table__header--fixed"><tr><th data-colkey="__EXPAND_ROW_ICON_COLUMN__" class="t-table__expandable-icon-cell t-table__th-__EXPAND_ROW_ICON_COLUMN__"><div class="t-table__th-cell-inner"></div></th><th data-colkey="row-select" class="t-table__cell-check t-table__th-row-select"><div class="t-table__th-cell-inner"><label tabindex="0" class="t-checkbox"><input type="checkbox" class="t-checkbox__former" tabindex="-1"/><span class="t-checkbox__input"></span></label></div></th><th data-colkey="serial-number" class="t-table__th-serial-number"><div class="t-table__th-cell-inner">序号</div></th><th data-colkey="applicant" class="t-table__th-applicant"><div class="t-table__th-cell-inner">申请人</div></th><th data-colkey="status" class="t-table__th-status"><div class="t-table__th-cell-inner">状态</div></th><th data-colkey="matters" class="t-table__th-matters"><div class="t-table__th-cell-inner">申请事项</div></th></tr></thead><tbody class="t-table__body" style="transform:translateY(25000px);-ms-transform:translateY(25000px);-moz-transform:translateY(25000px);-webkit-transform:translateY(25000px)"><tr class="t-table__empty-row"><td colSpan="6"><div class="t-table__empty">Empty Data</div></td></tr></tbody></table></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test packages/components/table/_example/tree-select.tsx 1`] = `"<div style="gap:16px" class="t-space t-space-vertical"><div class="t-space-item"><div style="gap:16px" class="t-space t-space-horizontal"><div class="t-space-item"><div class="t-radio-group t-size-m t-radio-group--filled"><label tabindex="0" class="t-radio-button"><input type="radio" class="t-radio-button__former" tabindex="-1" data-value="true" value="1"/><span class="t-radio-button__input"></span><span class="t-radio-button__label">父子行选中独立</span></label><label tabindex="0" class="t-radio-button t-is-checked" checked=""><input type="radio" class="t-radio-button__former" tabindex="-1" data-value="false" checked="" value="0"/><span class="t-radio-button__input"></span><span class="t-radio-button__label">父子行选中关联</span></label><div class="t-radio-group__bg-block"></div></div></div><div class="t-space-item"><button type="button" class="t-button t-button--theme-primary t-button--variant-base"><span class="t-button__text">获取树形结构展开的节点</span></button></div><div class="t-space-item"><button type="button" class="t-button t-button--theme-primary t-button--variant-base"><span class="t-button__text">滚动到指定元素</span></button></div></div></div><div class="t-space-item"><div class="t-table" style="position:relative"><div class="t-table__content" style="height:300px"><div class="t-table__virtual-scroll-cursor" style="transform:translate(0, 0px);-ms-transform:translate(0, 0px);-moz-transform:translate(0, 0px);-webkit-transform:translate(0, 0px)"></div><table class="t-table--layout-fixed t-table--full-height"><colgroup><col style="width:46px"/><col style="width:50px"/><col style="min-width:80px"/><col style="min-width:80px"/><col style="min-width:80px"/><col style="min-width:80px"/></colgroup><thead class="t-table__header t-table__header--fixed"><tr><th data-colkey="__EXPAND_ROW_ICON_COLUMN__" class="t-table__expandable-icon-cell t-table__th-__EXPAND_ROW_ICON_COLUMN__"><div class="t-table__th-cell-inner"></div></th><th data-colkey="row-select" class="t-table__cell-check t-table__th-row-select"><div class="t-table__th-cell-inner"><label tabindex="0" class="t-checkbox"><input type="checkbox" class="t-checkbox__former" tabindex="-1"/><span class="t-checkbox__input"></span></label></div></th><th data-colkey="serial-number" class="t-table__th-serial-number"><div class="t-table__th-cell-inner">序号</div></th><th data-colkey="applicant" class="t-table__th-applicant"><div class="t-table__th-cell-inner">申请人</div></th><th data-colkey="status" class="t-table__th-status"><div class="t-table__th-cell-inner">状态</div></th><th data-colkey="matters" class="t-table__th-matters"><div class="t-table__th-cell-inner">申请事项</div></th></tr></thead><tbody class="t-table__body" style="transform:translateY(25000px);-ms-transform:translateY(25000px);-moz-transform:translateY(25000px);-webkit-transform:translateY(25000px)"></tbody></table></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test packages/components/table/_example/virtual-scroll.tsx 1`] = `"<div style="gap:16px" class="t-space t-space-vertical"><div class="t-space-item"><div style="gap:16px" class="t-space t-space-align-center t-space-horizontal"><div class="t-space-item"><button type="button" class="t-button t-button--theme-primary t-button--variant-base"><span class="t-button__text">滚动到指定元素</span></button></div><div class="t-space-item"><label tabindex="0" class="t-checkbox t-is-checked" checked=""><input type="checkbox" class="t-checkbox__former" tabindex="-1" checked=""/><span class="t-checkbox__input"></span><span class="t-checkbox__label">是否显示边框</span></label></div></div></div><div class="t-space-item"><div class="t-table t-table--bordered" style="position:relative"><div class="t-table__content" style="height:300px"><div class="t-table__virtual-scroll-cursor" style="transform:translate(0, 0px);-ms-transform:translate(0, 0px);-moz-transform:translate(0, 0px);-webkit-transform:translate(0, 0px)"></div><table class="t-table--layout-fixed t-table--full-height"><colgroup><col style="width:70px"/><col style="width:100px"/><col style="width:150px"/><col style="width:140px"/><col style="min-width:80px"/><col style="min-width:80px"/></colgroup><thead class="t-table__header t-table__header--fixed"><tr><th data-colkey="serial-number" class="t-table__th-serial-number"><div class="t-table__th-cell-inner">序号</div></th><th data-colkey="applicant" class="t-table__th-applicant"><div class="t-table__th-cell-inner">申请人</div></th><th data-colkey="status" class="t-table__th-status"><div class="t-table__th-cell-inner">申请状态</div></th><th data-colkey="matters" class="t-table__th-matters"><div class="t-table__th-cell-inner">申请事项</div></th><th data-colkey="detail.email" class="t-table__th-detail.email"><div class="t-table__th-cell-inner">邮箱地址</div></th><th data-colkey="createTime" class="t-table__th-createTime"><div class="t-table__th-cell-inner">申请时间</div></th></tr></thead><tbody class="t-table__body" style="transform:translateY(48000px);-ms-transform:translateY(48000px);-moz-transform:translateY(48000px);-webkit-transform:translateY(48000px)"><tr class="t-table__empty-row"><td colSpan="6"><div class="t-table__empty">Empty Data</div></td></tr></tbody></table></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test packages/components/table/_example/virtual-scroll.tsx 1`] = `"<div style="gap:16px" class="t-space t-space-vertical"><div class="t-space-item"><div style="gap:16px" class="t-space t-space-align-center t-space-horizontal"><div class="t-space-item"><button type="button" class="t-button t-button--theme-primary t-button--variant-base"><span class="t-button__text">滚动到指定元素</span></button></div><div class="t-space-item"><label tabindex="0" class="t-checkbox t-is-checked" checked=""><input type="checkbox" class="t-checkbox__former" tabindex="-1" checked=""/><span class="t-checkbox__input"></span><span class="t-checkbox__label">是否显示边框</span></label></div></div></div><div class="t-space-item"><div class="t-table t-table--bordered" style="position:relative"><div class="t-table__content" style="height:300px"><div class="t-table__virtual-scroll-cursor" style="transform:translate(0, 0px);-ms-transform:translate(0, 0px);-moz-transform:translate(0, 0px);-webkit-transform:translate(0, 0px)"></div><table class="t-table--layout-fixed t-table--full-height"><colgroup><col style="width:70px"/><col style="width:100px"/><col style="width:150px"/><col style="width:140px"/><col style="min-width:80px"/><col style="min-width:80px"/></colgroup><thead class="t-table__header t-table__header--fixed"><tr><th data-colkey="serial-number" class="t-table__th-serial-number"><div class="t-table__th-cell-inner">序号</div></th><th data-colkey="applicant" class="t-table__th-applicant"><div class="t-table__th-cell-inner">申请人</div></th><th data-colkey="status" class="t-table__th-status"><div class="t-table__th-cell-inner">申请状态</div></th><th data-colkey="matters" class="t-table__th-matters"><div class="t-table__th-cell-inner">申请事项</div></th><th data-colkey="detail.email" class="t-table__th-detail.email"><div class="t-table__th-cell-inner">邮箱地址</div></th><th data-colkey="createTime" class="t-table__th-createTime"><div class="t-table__th-cell-inner">申请时间</div></th></tr></thead><tbody class="t-table__body" style="transform:translateY(48000px);-ms-transform:translateY(48000px);-moz-transform:translateY(48000px);-webkit-transform:translateY(48000px)"></tbody></table></div></div></div></div>"`;
 
 exports[`ssr snapshot test > ssr test packages/components/tabs/_example/ban.tsx 1`] = `"<div style="width:100%;gap:24px" class="t-space t-space-vertical"><div class="t-space-item"><div class="t-radio-group t-size-m t-radio-group--filled"><label tabindex="0" class="t-radio-button t-is-checked" checked=""><input type="radio" class="t-radio-button__former" tabindex="-1" data-value="&#x27;normal&#x27;" checked="" value="normal"/><span class="t-radio-button__input"></span><span class="t-radio-button__label">常规型</span></label><label tabindex="0" class="t-radio-button"><input type="radio" class="t-radio-button__former" tabindex="-1" data-value="&#x27;card&#x27;" value="card"/><span class="t-radio-button__input"></span><span class="t-radio-button__label">卡片型</span></label><div class="t-radio-group__bg-block"></div></div></div><div class="t-space-item"><div class="t-tabs"><div class="t-tabs__header t-is-top"><div class="t-tabs__nav" style="min-height:48px"><div class="t-tabs__operations t-tabs__operations--left"></div><div class="t-tabs__operations t-tabs__operations--right"></div><div class="t-tabs__nav-container t-is-top"><div class="t-tabs__nav-scroll"><div class="t-tabs__nav-wrap t-is-smooth" style="transform:translate(0px, 0)"><div class="t-tabs__bar t-is-top"></div><div class="t-tabs__bar t-is-top"></div><div class="t-tabs__nav-item t-size-m t-is-active t-is-top"><div class="t-tabs__nav-item-wrapper"><span class="t-tabs__nav-item-text-wrapper">选项卡1</span></div></div><div class="t-tabs__nav-item t-size-m t-is-top t-is-disabled"><div class="t-tabs__nav-item-wrapper"><span class="t-tabs__nav-item-text-wrapper">选项卡2</span></div></div><div class="t-tabs__nav-item t-size-m t-is-top"><div class="t-tabs__nav-item-wrapper"><span class="t-tabs__nav-item-text-wrapper">选项卡3</span></div></div></div></div></div></div></div><div class="t-tabs__content t-is-top"><div class="t-tab-panel"><div style="margin:20px">选项卡1内容区</div></div></div></div></div></div>"`;
 
diff --git a/test/snap/__snapshots__/ssr.test.jsx.snap b/test/snap/__snapshots__/ssr.test.jsx.snap
index a0eed62d03..1662c7e052 100644
--- a/test/snap/__snapshots__/ssr.test.jsx.snap
+++ b/test/snap/__snapshots__/ssr.test.jsx.snap
@@ -1012,9 +1012,9 @@ exports[`ssr snapshot test > ssr test packages/components/table/_example/style.t
 
 exports[`ssr snapshot test > ssr test packages/components/table/_example/tree.tsx 1`] = `"<div style="gap:16px" class="t-space t-space-vertical"><div class="t-space-item"><div style="gap:16px" class="t-space t-space-horizontal"><div class="t-space-item"><button type="button" class="t-button t-button--theme-primary t-button--variant-base"><span class="t-button__text">添加根节点</span></button></div><div class="t-space-item"><button style="margin-left:16px" type="button" class="t-button t-button--theme-default t-button--variant-base"><span class="t-button__text">重置/更新数据</span></button></div><div class="t-space-item"><button style="margin-left:16px" type="button" class="t-button t-button--theme-default t-button--variant-base"><span class="t-button__text">展开/收起可见行</span></button></div><div class="t-space-item"><button style="margin-left:16px" type="button" class="t-button t-button--theme-default t-button--variant-base"><span class="t-button__text">展开全部</span></button></div><div class="t-space-item"><button style="margin-left:16px" type="button" class="t-button t-button--theme-default t-button--variant-base"><span class="t-button__text">获取全部树形结构</span></button></div></div></div><div class="t-space-item"><label tabindex="0" class="t-checkbox" style="vertical-align:middle"><input type="checkbox" class="t-checkbox__former" tabindex="-1"/><span class="t-checkbox__input"></span><span class="t-checkbox__label">自定义折叠/展开图标</span></label></div><div class="t-space-item"><div class="t-table t-table--row-handler-draggable" style="position:relative"><div class="t-table__content"><table class="t-table--layout-fixed"><colgroup><col style="width:46px"/><col style="width:80px"/><col style="width:180px"/><col style="width:100px"/><col style="width:340px"/></colgroup><thead class="t-table__header"><tr><th data-colkey="drag" class="t-table__th-drag t-align-center"><div class="t-table__th-cell-inner">排序</div></th><th data-colkey="id" class="t-table__th-id"><div class="t-table__th-cell-inner"><div class="t-table__ellipsis t-text-ellipsis">编号</div></div></th><th data-colkey="key" class="t-table__th-key"><div class="t-table__th-cell-inner"><div class="t-table__ellipsis t-text-ellipsis">名称</div></div></th><th data-colkey="platform" class="t-table__th-platform"><div class="t-table__th-cell-inner">签署方式</div></th><th data-colkey="operate" class="t-table__th-operate t-align-center"><div class="t-table__th-cell-inner">操作</div></th></tr></thead><tbody class="t-table__body"><tr data-id="申请人 0_1 号" class=""><td class="t-align-center t-table__handle-draggable"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-move"><path fill="currentColor" d="M6.75 2.25h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3z"></path></svg></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis">0</div></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis"><div class="t-table__tree-col t-table__tree-col--inline">申请人 0_1 号</div></div></td><td class="">电子签署</td><td class="t-align-center"><div class="tdesign-table-demo__table-operations"><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">插入</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">前插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">后插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">更新</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">查看</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">删除</a></div></td></tr><tr data-id="申请人 1_1 号" class=""><td class="t-align-center t-table__handle-draggable"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-move"><path fill="currentColor" d="M6.75 2.25h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3z"></path></svg></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis">1</div></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis"><div class="t-table__tree-col t-table__tree-col--inline"><span class="t-table__tree-op-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add-rectangle"><path fill="currentColor" d="M2 2h20v20H2V2zm2 2v16h16V4H4zm9 2.5V11h4.5v2H13v4.5h-2V13H6.5v-2H11V6.5h2z"></path></svg></span>申请人 1_1 号</div></div></td><td class="">纸质签署</td><td class="t-align-center"><div class="tdesign-table-demo__table-operations"><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">插入</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">前插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">后插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">更新</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">查看</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">删除</a></div></td></tr><tr data-id="申请人 2_1 号" class=""><td class="t-align-center t-table__handle-draggable"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-move"><path fill="currentColor" d="M6.75 2.25h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3z"></path></svg></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis">2</div></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis"><div class="t-table__tree-col t-table__tree-col--inline"><span class="t-table__tree-op-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add-rectangle"><path fill="currentColor" d="M2 2h20v20H2V2zm2 2v16h16V4H4zm9 2.5V11h4.5v2H13v4.5h-2V13H6.5v-2H11V6.5h2z"></path></svg></span>申请人 2_1 号</div></div></td><td class="">电子签署</td><td class="t-align-center"><div class="tdesign-table-demo__table-operations"><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">插入</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">前插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">后插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">更新</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">查看</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">删除</a></div></td></tr><tr data-id="申请人 3_1 号" class=""><td class="t-align-center t-table__handle-draggable"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-move"><path fill="currentColor" d="M6.75 2.25h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3z"></path></svg></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis">3</div></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis"><div class="t-table__tree-col t-table__tree-col--inline"><span class="t-table__tree-op-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add-rectangle"><path fill="currentColor" d="M2 2h20v20H2V2zm2 2v16h16V4H4zm9 2.5V11h4.5v2H13v4.5h-2V13H6.5v-2H11V6.5h2z"></path></svg></span>申请人 3_1 号</div></div></td><td class="">纸质签署</td><td class="t-align-center"><div class="tdesign-table-demo__table-operations"><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">插入</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">前插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">后插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">更新</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">查看</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">删除</a></div></td></tr><tr data-id="申请人 4_1 号" class=""><td class="t-align-center t-table__handle-draggable"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-move"><path fill="currentColor" d="M6.75 2.25h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3z"></path></svg></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis">4</div></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis"><div class="t-table__tree-col t-table__tree-col--inline"><span class="t-table__tree-op-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add-rectangle"><path fill="currentColor" d="M2 2h20v20H2V2zm2 2v16h16V4H4zm9 2.5V11h4.5v2H13v4.5h-2V13H6.5v-2H11V6.5h2z"></path></svg></span>申请人 4_1 号</div></div></td><td class="">电子签署</td><td class="t-align-center"><div class="tdesign-table-demo__table-operations"><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">插入</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">前插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">后插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">更新</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">查看</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">删除</a></div></td></tr><tr data-id="申请人懒加载节点 66666，点我体验" class=""><td class="t-align-center t-table__handle-draggable"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-move"><path fill="currentColor" d="M6.75 2.25h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3z"></path></svg></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis">66666</div></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis"><div class="t-table__tree-col t-table__tree-col--inline"><span class="t-table__tree-op-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add-rectangle"><path fill="currentColor" d="M2 2h20v20H2V2zm2 2v16h16V4H4zm9 2.5V11h4.5v2H13v4.5h-2V13H6.5v-2H11V6.5h2z"></path></svg></span>申请人懒加载节点 66666，点我体验</div></div></td><td class="">电子签署</td><td class="t-align-center"><div class="tdesign-table-demo__table-operations"><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">插入</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">前插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">后插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">更新</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">查看</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">删除</a></div></td></tr><tr data-id="申请人懒加载节点 88888，点我体验 " class=""><td class="t-align-center t-table__handle-draggable"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-move"><path fill="currentColor" d="M6.75 2.25h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3zm-7.5 5.5h3v3h-3v-3zm7.5 0h3v3h-3v-3z"></path></svg></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis">88888</div></td><td class="t-table-td--ellipsis"><div class="t-table__ellipsis t-text-ellipsis"><div class="t-table__tree-col t-table__tree-col--inline"><span class="t-table__tree-op-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add-rectangle"><path fill="currentColor" d="M2 2h20v20H2V2zm2 2v16h16V4H4zm9 2.5V11h4.5v2H13v4.5h-2V13H6.5v-2H11V6.5h2z"></path></svg></span>申请人懒加载节点 88888，点我体验 </div></div></td><td class="">电子签署</td><td class="t-align-center"><div class="tdesign-table-demo__table-operations"><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">插入</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">前插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">后插</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">更新</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">查看</a><a style="padding:0 8px" class="t-link t-link--theme-default t-link--hover-color">删除</a></div></td></tr></tbody></table></div><div class="t-table__pagination-wrap" style="opacity:1"><div class="t-table__pagination"><div class="t-pagination"><div class="t-pagination__total">Total 100 items</div><div class="t-pagination__select"><div class="t-select__wrap"><div class="t-select t-select-input t-select-input--empty"><div class="t-input__wrap t-input--auto-width" spellcheck="false"><div class="t-input t-is-readonly t-align-left t-input--suffix"><input placeholder="please select" type="text" class="t-input__inner" readonly="" value=""/><span class="t-input__input-pre">please select</span><span class="t-input__suffix t-input__suffix-icon"><svg class="t-fake-arrow t-select__right-icon" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path></svg></span></div></div></div></div></div><div class="t-pagination__btn t-pagination__btn-prev t-is-disabled"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-left"><path fill="currentColor" d="M15.91 17.5l-5.5-5.5 5.5-5.5-1.41-1.41L7.59 12l6.91 6.91 1.41-1.41z"></path></svg></div><ul class="t-pagination__pager"><li class="t-pagination__number t-is-current">1</li><li class="t-pagination__number">2</li><li class="t-pagination__number">3</li><li class="t-pagination__number">4</li><li class="t-pagination__number">5</li><li class="t-pagination__number">6</li><li class="t-pagination__number">7</li><li class="t-pagination__number">8</li><li class="t-pagination__number">9</li><li class="t-pagination__number">10</li></ul><div class="t-pagination__btn t-pagination__btn-next"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right"><path fill="currentColor" d="M8.09 17.5l5.5-5.5-5.5-5.5L9.5 5.09 16.41 12 9.5 18.91 8.09 17.5z"></path></svg></div></div></div></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test packages/components/table/_example/tree-select.tsx 1`] = `"<div style="gap:16px" class="t-space t-space-vertical"><div class="t-space-item"><div style="gap:16px" class="t-space t-space-horizontal"><div class="t-space-item"><div class="t-radio-group t-size-m t-radio-group--filled"><label tabindex="0" class="t-radio-button"><input type="radio" class="t-radio-button__former" tabindex="-1" data-value="true" value="1"/><span class="t-radio-button__input"></span><span class="t-radio-button__label">父子行选中独立</span></label><label tabindex="0" class="t-radio-button t-is-checked" checked=""><input type="radio" class="t-radio-button__former" tabindex="-1" data-value="false" checked="" value="0"/><span class="t-radio-button__input"></span><span class="t-radio-button__label">父子行选中关联</span></label><div class="t-radio-group__bg-block"></div></div></div><div class="t-space-item"><button type="button" class="t-button t-button--theme-primary t-button--variant-base"><span class="t-button__text">获取树形结构展开的节点</span></button></div><div class="t-space-item"><button type="button" class="t-button t-button--theme-primary t-button--variant-base"><span class="t-button__text">滚动到指定元素</span></button></div></div></div><div class="t-space-item"><div class="t-table" style="position:relative"><div class="t-table__content" style="height:300px"><div class="t-table__virtual-scroll-cursor" style="transform:translate(0, 0px);-ms-transform:translate(0, 0px);-moz-transform:translate(0, 0px);-webkit-transform:translate(0, 0px)"></div><table class="t-table--layout-fixed t-table--full-height"><colgroup><col style="width:46px"/><col style="width:50px"/><col style="min-width:80px"/><col style="min-width:80px"/><col style="min-width:80px"/><col style="min-width:80px"/></colgroup><thead class="t-table__header t-table__header--fixed"><tr><th data-colkey="__EXPAND_ROW_ICON_COLUMN__" class="t-table__expandable-icon-cell t-table__th-__EXPAND_ROW_ICON_COLUMN__"><div class="t-table__th-cell-inner"></div></th><th data-colkey="row-select" class="t-table__cell-check t-table__th-row-select"><div class="t-table__th-cell-inner"><label tabindex="0" class="t-checkbox"><input type="checkbox" class="t-checkbox__former" tabindex="-1"/><span class="t-checkbox__input"></span></label></div></th><th data-colkey="serial-number" class="t-table__th-serial-number"><div class="t-table__th-cell-inner">序号</div></th><th data-colkey="applicant" class="t-table__th-applicant"><div class="t-table__th-cell-inner">申请人</div></th><th data-colkey="status" class="t-table__th-status"><div class="t-table__th-cell-inner">状态</div></th><th data-colkey="matters" class="t-table__th-matters"><div class="t-table__th-cell-inner">申请事项</div></th></tr></thead><tbody class="t-table__body" style="transform:translateY(25000px);-ms-transform:translateY(25000px);-moz-transform:translateY(25000px);-webkit-transform:translateY(25000px)"><tr class="t-table__empty-row"><td colSpan="6"><div class="t-table__empty">Empty Data</div></td></tr></tbody></table></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test packages/components/table/_example/tree-select.tsx 1`] = `"<div style="gap:16px" class="t-space t-space-vertical"><div class="t-space-item"><div style="gap:16px" class="t-space t-space-horizontal"><div class="t-space-item"><div class="t-radio-group t-size-m t-radio-group--filled"><label tabindex="0" class="t-radio-button"><input type="radio" class="t-radio-button__former" tabindex="-1" data-value="true" value="1"/><span class="t-radio-button__input"></span><span class="t-radio-button__label">父子行选中独立</span></label><label tabindex="0" class="t-radio-button t-is-checked" checked=""><input type="radio" class="t-radio-button__former" tabindex="-1" data-value="false" checked="" value="0"/><span class="t-radio-button__input"></span><span class="t-radio-button__label">父子行选中关联</span></label><div class="t-radio-group__bg-block"></div></div></div><div class="t-space-item"><button type="button" class="t-button t-button--theme-primary t-button--variant-base"><span class="t-button__text">获取树形结构展开的节点</span></button></div><div class="t-space-item"><button type="button" class="t-button t-button--theme-primary t-button--variant-base"><span class="t-button__text">滚动到指定元素</span></button></div></div></div><div class="t-space-item"><div class="t-table" style="position:relative"><div class="t-table__content" style="height:300px"><div class="t-table__virtual-scroll-cursor" style="transform:translate(0, 0px);-ms-transform:translate(0, 0px);-moz-transform:translate(0, 0px);-webkit-transform:translate(0, 0px)"></div><table class="t-table--layout-fixed t-table--full-height"><colgroup><col style="width:46px"/><col style="width:50px"/><col style="min-width:80px"/><col style="min-width:80px"/><col style="min-width:80px"/><col style="min-width:80px"/></colgroup><thead class="t-table__header t-table__header--fixed"><tr><th data-colkey="__EXPAND_ROW_ICON_COLUMN__" class="t-table__expandable-icon-cell t-table__th-__EXPAND_ROW_ICON_COLUMN__"><div class="t-table__th-cell-inner"></div></th><th data-colkey="row-select" class="t-table__cell-check t-table__th-row-select"><div class="t-table__th-cell-inner"><label tabindex="0" class="t-checkbox"><input type="checkbox" class="t-checkbox__former" tabindex="-1"/><span class="t-checkbox__input"></span></label></div></th><th data-colkey="serial-number" class="t-table__th-serial-number"><div class="t-table__th-cell-inner">序号</div></th><th data-colkey="applicant" class="t-table__th-applicant"><div class="t-table__th-cell-inner">申请人</div></th><th data-colkey="status" class="t-table__th-status"><div class="t-table__th-cell-inner">状态</div></th><th data-colkey="matters" class="t-table__th-matters"><div class="t-table__th-cell-inner">申请事项</div></th></tr></thead><tbody class="t-table__body" style="transform:translateY(25000px);-ms-transform:translateY(25000px);-moz-transform:translateY(25000px);-webkit-transform:translateY(25000px)"></tbody></table></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test packages/components/table/_example/virtual-scroll.tsx 1`] = `"<div style="gap:16px" class="t-space t-space-vertical"><div class="t-space-item"><div style="gap:16px" class="t-space t-space-align-center t-space-horizontal"><div class="t-space-item"><button type="button" class="t-button t-button--theme-primary t-button--variant-base"><span class="t-button__text">滚动到指定元素</span></button></div><div class="t-space-item"><label tabindex="0" class="t-checkbox t-is-checked" checked=""><input type="checkbox" class="t-checkbox__former" tabindex="-1" checked=""/><span class="t-checkbox__input"></span><span class="t-checkbox__label">是否显示边框</span></label></div></div></div><div class="t-space-item"><div class="t-table t-table--bordered" style="position:relative"><div class="t-table__content" style="height:300px"><div class="t-table__virtual-scroll-cursor" style="transform:translate(0, 0px);-ms-transform:translate(0, 0px);-moz-transform:translate(0, 0px);-webkit-transform:translate(0, 0px)"></div><table class="t-table--layout-fixed t-table--full-height"><colgroup><col style="width:70px"/><col style="width:100px"/><col style="width:150px"/><col style="width:140px"/><col style="min-width:80px"/><col style="min-width:80px"/></colgroup><thead class="t-table__header t-table__header--fixed"><tr><th data-colkey="serial-number" class="t-table__th-serial-number"><div class="t-table__th-cell-inner">序号</div></th><th data-colkey="applicant" class="t-table__th-applicant"><div class="t-table__th-cell-inner">申请人</div></th><th data-colkey="status" class="t-table__th-status"><div class="t-table__th-cell-inner">申请状态</div></th><th data-colkey="matters" class="t-table__th-matters"><div class="t-table__th-cell-inner">申请事项</div></th><th data-colkey="detail.email" class="t-table__th-detail.email"><div class="t-table__th-cell-inner">邮箱地址</div></th><th data-colkey="createTime" class="t-table__th-createTime"><div class="t-table__th-cell-inner">申请时间</div></th></tr></thead><tbody class="t-table__body" style="transform:translateY(48000px);-ms-transform:translateY(48000px);-moz-transform:translateY(48000px);-webkit-transform:translateY(48000px)"><tr class="t-table__empty-row"><td colSpan="6"><div class="t-table__empty">Empty Data</div></td></tr></tbody></table></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test packages/components/table/_example/virtual-scroll.tsx 1`] = `"<div style="gap:16px" class="t-space t-space-vertical"><div class="t-space-item"><div style="gap:16px" class="t-space t-space-align-center t-space-horizontal"><div class="t-space-item"><button type="button" class="t-button t-button--theme-primary t-button--variant-base"><span class="t-button__text">滚动到指定元素</span></button></div><div class="t-space-item"><label tabindex="0" class="t-checkbox t-is-checked" checked=""><input type="checkbox" class="t-checkbox__former" tabindex="-1" checked=""/><span class="t-checkbox__input"></span><span class="t-checkbox__label">是否显示边框</span></label></div></div></div><div class="t-space-item"><div class="t-table t-table--bordered" style="position:relative"><div class="t-table__content" style="height:300px"><div class="t-table__virtual-scroll-cursor" style="transform:translate(0, 0px);-ms-transform:translate(0, 0px);-moz-transform:translate(0, 0px);-webkit-transform:translate(0, 0px)"></div><table class="t-table--layout-fixed t-table--full-height"><colgroup><col style="width:70px"/><col style="width:100px"/><col style="width:150px"/><col style="width:140px"/><col style="min-width:80px"/><col style="min-width:80px"/></colgroup><thead class="t-table__header t-table__header--fixed"><tr><th data-colkey="serial-number" class="t-table__th-serial-number"><div class="t-table__th-cell-inner">序号</div></th><th data-colkey="applicant" class="t-table__th-applicant"><div class="t-table__th-cell-inner">申请人</div></th><th data-colkey="status" class="t-table__th-status"><div class="t-table__th-cell-inner">申请状态</div></th><th data-colkey="matters" class="t-table__th-matters"><div class="t-table__th-cell-inner">申请事项</div></th><th data-colkey="detail.email" class="t-table__th-detail.email"><div class="t-table__th-cell-inner">邮箱地址</div></th><th data-colkey="createTime" class="t-table__th-createTime"><div class="t-table__th-cell-inner">申请时间</div></th></tr></thead><tbody class="t-table__body" style="transform:translateY(48000px);-ms-transform:translateY(48000px);-moz-transform:translateY(48000px);-webkit-transform:translateY(48000px)"></tbody></table></div></div></div></div>"`;
 
 exports[`ssr snapshot test > ssr test packages/components/tabs/_example/ban.tsx 1`] = `"<div style="width:100%;gap:24px" class="t-space t-space-vertical"><div class="t-space-item"><div class="t-radio-group t-size-m t-radio-group--filled"><label tabindex="0" class="t-radio-button t-is-checked" checked=""><input type="radio" class="t-radio-button__former" tabindex="-1" data-value="&#x27;normal&#x27;" checked="" value="normal"/><span class="t-radio-button__input"></span><span class="t-radio-button__label">常规型</span></label><label tabindex="0" class="t-radio-button"><input type="radio" class="t-radio-button__former" tabindex="-1" data-value="&#x27;card&#x27;" value="card"/><span class="t-radio-button__input"></span><span class="t-radio-button__label">卡片型</span></label><div class="t-radio-group__bg-block"></div></div></div><div class="t-space-item"><div class="t-tabs"><div class="t-tabs__header t-is-top"><div class="t-tabs__nav" style="min-height:48px"><div class="t-tabs__operations t-tabs__operations--left"></div><div class="t-tabs__operations t-tabs__operations--right"></div><div class="t-tabs__nav-container t-is-top"><div class="t-tabs__nav-scroll"><div class="t-tabs__nav-wrap t-is-smooth" style="transform:translate(0px, 0)"><div class="t-tabs__bar t-is-top"></div><div class="t-tabs__bar t-is-top"></div><div class="t-tabs__nav-item t-size-m t-is-active t-is-top"><div class="t-tabs__nav-item-wrapper"><span class="t-tabs__nav-item-text-wrapper">选项卡1</span></div></div><div class="t-tabs__nav-item t-size-m t-is-top t-is-disabled"><div class="t-tabs__nav-item-wrapper"><span class="t-tabs__nav-item-text-wrapper">选项卡2</span></div></div><div class="t-tabs__nav-item t-size-m t-is-top"><div class="t-tabs__nav-item-wrapper"><span class="t-tabs__nav-item-text-wrapper">选项卡3</span></div></div></div></div></div></div></div><div class="t-tabs__content t-is-top"><div class="t-tab-panel"><div style="margin:20px">选项卡1内容区</div></div></div></div></div></div>"`;
 


Reviews:
user: login: copilot-pull-request-reviewer[bot]
body: ## Pull Request Overview

This PR fixes issues with the fixedRows rendering when virtual scroll is enabled in the table component. The changes update how virtualization parameters are passed, adjust the fixed row offset calculations, and ensure that the table body uses the correct data subset for rendering.

### Reviewed Changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated 1 comment.

<details>
<summary>Show a summary per file</summary>

| File                                                  | Description                                                                           |
| ----------------------------------------------------- | ------------------------------------------------------------------------------------- |
| packages/components/hooks/useVirtualScroll.ts         | Adds fixedRows to the TScroll type and adjusts the calculation for visible data.      |
| packages/components/table/BaseTable.tsx               | Modifies virtualScroll parameter handling and changes the data prop to use newData.     |
| packages/components/table/hooks/useFixed.ts           | Updates fixed row style calculations to incorporate a virtual scroll offset.           |
| packages/components/table/TBody.tsx                   | Alters data iteration to conditionally use virtual scroll visibleData for rendering.  |
| packages/components/table/TR.tsx                      | Passes the virtual scroll translateY offset to the fixed style helper function.       |
</details>



<details>
<summary>Comments suppressed due to low confidence (1)</summary>

**packages/components/table/BaseTable.tsx:466**
* Changing the data prop to always use newData bypasses virtualConfig.visibleData when virtual scroll is active, which may negate virtualization benefits and affect fixedRows behavior. Verify that this change is intentional and that performance and rendering of fixed rows are as expected.
```
data: newData,
```
</details>


state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-11T13:45:24Z
user: login: huangchen1031
state: COMMENTED
author_association: COLLABORATOR
submitted_at: 2025-03-12T07:00:58Z
user: login: uyarn
state: APPROVED
author_association: COLLABORATOR
submitted_at: 2025-03-18T08:54:17Z

Review comments:
diff_hunk: @@ -77,12 +80,27 @@ const useVirtualScroll = (container: MutableRefObject<HTMLElement>, params: UseV
     if (currentIndex < 0) return;
     const startIndex = Math.max(currentIndex - tScroll.bufferSize, 0);
     const endIndex = Math.min(lastIndex + tScroll.bufferSize, trScrollTopHeightList.length);
+
+    // 计算固定行情况
+    const { fixedRows } = tScroll;
+    const [fixedStart, fixedEnd] = fixedRows;
+    let fixedStartData = fixedStart ? data.slice(0, fixedStart) : [];
+    if (fixedStart && startIndex < fixedStart) {
+      fixedStartData = fixedStartData.slice(0, startIndex);
+    }
+    let fixedEndData = fixedEnd ? data.slice(data.length - fixedEnd) : [];
+    const bottomStartIndex = endIndex - data.length + 1 + (fixedEnd ?? 0);
+    if (fixedEnd && bottomStartIndex > 0) {
+      fixedEndData = fixedEndData.slice(bottomStartIndex);
+    }
+
     if (startAndEndIndex.join() !== [startIndex, endIndex].join() && startIndex >= 0) {
-      const tmpVisibleData = data.slice(startIndex, endIndex);
+      const tmpVisibleData = fixedStartData.concat(data.slice(startIndex, endIndex)).concat(fixedEndData);
       setVisibleData(tmpVisibleData);
       const lastScrollTop = trScrollTopHeightList[startIndex - 1];
       const top = lastScrollTop > 0 ? lastScrollTop : 0;
-      setTranslateY(top);
+      const stickyHeight = trScrollTopHeightList[Math.min(startIndex, fixedStart) - 1] || 0;
path: packages/components/hooks/useVirtualScroll.ts
user: login: Copilot
body: The index calculation (Math.min(startIndex, fixedStart) - 1) may result in a negative index, which could lead to unexpected behavior. Consider adding a check to ensure the index is non-negative.
```suggestion
      const index = Math.min(startIndex, fixedStart) - 1;
      const stickyHeight = trScrollTopHeightList[index >= 0 ? index : 0] || 0;
```
created_at: 2025-03-11T13:45:23Z
author_association: CONTRIBUTOR
diff_hunk: @@ -77,12 +80,27 @@ const useVirtualScroll = (container: MutableRefObject<HTMLElement>, params: UseV
     if (currentIndex < 0) return;
     const startIndex = Math.max(currentIndex - tScroll.bufferSize, 0);
     const endIndex = Math.min(lastIndex + tScroll.bufferSize, trScrollTopHeightList.length);
+
+    // 计算固定行情况
+    const { fixedRows } = tScroll;
+    const [fixedStart, fixedEnd] = fixedRows;
+    let fixedStartData = fixedStart ? data.slice(0, fixedStart) : [];
+    if (fixedStart && startIndex < fixedStart) {
+      fixedStartData = fixedStartData.slice(0, startIndex);
+    }
+    let fixedEndData = fixedEnd ? data.slice(data.length - fixedEnd) : [];
+    const bottomStartIndex = endIndex - data.length + 1 + (fixedEnd ?? 0);
+    if (fixedEnd && bottomStartIndex > 0) {
+      fixedEndData = fixedEndData.slice(bottomStartIndex);
+    }
+
     if (startAndEndIndex.join() !== [startIndex, endIndex].join() && startIndex >= 0) {
-      const tmpVisibleData = data.slice(startIndex, endIndex);
+      const tmpVisibleData = fixedStartData.concat(data.slice(startIndex, endIndex)).concat(fixedEndData);
       setVisibleData(tmpVisibleData);
       const lastScrollTop = trScrollTopHeightList[startIndex - 1];
       const top = lastScrollTop > 0 ? lastScrollTop : 0;
-      setTranslateY(top);
+      const stickyHeight = trScrollTopHeightList[Math.min(startIndex, fixedStart) - 1] || 0;
path: packages/components/hooks/useVirtualScroll.ts
user: login: huangchen1031
body: 负索引代表不需要stickyHeight，正好被后面的 || 0 处理掉，修改为0反而会有问题
created_at: 2025-03-12T07:00:58Z
author_association: COLLABORATOR

PR comments:
user: login: github-actions[bot]
created_at: 2025-03-11T10:08:41Z
body: <a href="https://preview-pr-3427-tdesign-react.surge.sh"><img height="96" alt="完成" src="https://user-images.githubusercontent.com/15634204/150816437-9f5bb788-cd67-4cbc-9897-b82d74e9aa65.png" /></a>
<!-- [工作流地址](https://github.com/Tencent/tdesign-react/actions/runs/13805702620) -->
<!-- AUTO_PREVIEW_HOOK -->
<!-- AUTO_PREVIEW_HOOK -->
author_association: CONTRIBUTOR
user: login: liweijie0812
created_at: 2025-03-11T11:24:48Z
body: /update-snapshot
author_association: COLLABORATOR
user: login: github-actions[bot]
created_at: 2025-03-11T11:25:20Z
body: ⏳ 正在运行快照更新。。。 CI: [Open](https://github.com//Tencent/tdesign-react/actions/runs/13786870753)
author_association: CONTRIBUTOR
user: login: liweijie0812
created_at: 2025-03-12T07:04:58Z
body: /update-snapshot
author_association: COLLABORATOR
user: login: github-actions[bot]
created_at: 2025-03-12T07:05:25Z
body: ⏳ 正在运行快照更新。。。 CI: [Open](https://github.com//Tencent/tdesign-react/actions/runs/13805594313)
author_association: CONTRIBUTOR