fix: VirtualTable missing renderIndex param for column.render (#1019)

* test: test driven

* fix: virtual missing renderIndex

Author: zombieJ

src/VirtualTable/BodyLine.tsx

@@ -21,7 +21,7 @@ export interface BodyLineProps<RecordType = any> {
 
 const BodyLine = React.forwardRef<HTMLDivElement, BodyLineProps>((props, ref) => {
   const { data, index, className, rowKey, style, extra, getHeight, ...restProps } = props;
-  const { record, indent } = data;
+  const { record, indent, index: renderIndex } = data;
 
   const { scrollX, flattenColumns, prefixCls, fixColumn, componentWidth } = useContext(
     TableContext,
@@ -102,6 +102,7 @@ const BodyLine = React.forwardRef<HTMLDivElement, BodyLineProps>((props, ref) =>
             colIndex={colIndex}
             indent={indent}
             index={index}
+            renderIndex={renderIndex}
             record={record}
             inverse={extra}
             getHeight={getHeight}

src/VirtualTable/VirtualCell.tsx

@@ -1,18 +1,20 @@
+import { useContext } from '@rc-component/context';
+import classNames from 'classnames';
 import * as React from 'react';
 import { getCellProps } from '../Body/BodyRow';
 import Cell from '../Cell';
+import type useRowInfo from '../hooks/useRowInfo';
 import type { ColumnType } from '../interface';
-import classNames from 'classnames';
-import { useContext } from '@rc-component/context';
 import { GridContext } from './context';
-import type useRowInfo from '../hooks/useRowInfo';
 
-export interface VirtualCellProps<RecordType extends { index: number }> {
+export interface VirtualCellProps<RecordType> {
   rowInfo: ReturnType<typeof useRowInfo>;
   column: ColumnType<RecordType>;
   colIndex: number;
   indent: number;
   index: number;
+  /** Used for `column.render` */
+  renderIndex: number;
   record: RecordType;
 
   // Follow props is used for RowSpanVirtualCell only
@@ -33,11 +35,20 @@ export function getColumnWidth(colIndex: number, colSpan: number, columnsOffset:
   return columnsOffset[colIndex + mergedColSpan] - (columnsOffset[colIndex] || 0);
 }
 
-function VirtualCell<RecordType extends { index: number } = any>(
-  props: VirtualCellProps<RecordType>,
-) {
-  const { rowInfo, column, colIndex, indent, index, record, style, className, inverse, getHeight } =
-    props;
+function VirtualCell<RecordType = any>(props: VirtualCellProps<RecordType>) {
+  const {
+    rowInfo,
+    column,
+    colIndex,
+    indent,
+    index,
+    renderIndex,
+    record,
+    style,
+    className,
+    inverse,
+    getHeight,
+  } = props;
 
   const { render, dataIndex, className: columnClassName, width: colWidth } = column;
 
@@ -108,7 +119,7 @@ function VirtualCell<RecordType extends { index: number } = any>(
       key={key}
       record={record}
       index={index}
-      renderIndex={record.index}
+      renderIndex={renderIndex}
       dataIndex={dataIndex}
       render={mergedRender}
       shouldCellUpdate={column.shouldCellUpdate}

tests/Virtual.spec.tsx

@@ -208,4 +208,22 @@ describe('Table.Virtual', () => {
 
     expect(container.querySelector('.rc-virtual-list')).toHaveAttribute('data-scroll-width', '603');
   });
+
+  it('render params should correct', () => {
+    const { container } = getTable({
+      columns: [
+        {
+          width: 93,
+          render: (_, __, index) => <div className="bamboo">{index}</div>,
+        },
+      ],
+      scroll: {
+        x: 1128,
+        y: 10,
+      },
+      data: [{}],
+    });
+
+    expect(container.querySelector('.bamboo').textContent).toEqual('0');
+  });
 });