fix(VDataTableVirtual): show index from virtualized items

Author: J-Sek

packages/vuetify/src/components/VDataTable/VDataTableRows.tsx

@@ -142,7 +142,7 @@ export const VDataTableRows = genericComponent<new <T>(
             }
 
             const slotProps = {
-              index,
+              index: item._virtualIndex ?? index,
               item: item.raw,
               internalItem: item,
               columns: columns.value,

packages/vuetify/src/components/VDataTable/VDataTableVirtual.tsx

@@ -141,7 +141,14 @@ export const VDataTableVirtual = genericComponent<new <T extends readonly any[],
       calculateVisibleItems,
       scrollToIndex,
     } = useVirtual(props, flatItems)
-    const displayItems = computed(() => computedItems.value.map(item => item.raw))
+
+    const displayItems = computed(() =>
+      computedItems.value
+        .map(item => ({
+          ...item.raw,
+          _virtualIndex: item.index,
+        }))
+    )
 
     useOptions({
       sortBy,

packages/vuetify/src/components/VDataTable/types.ts

@@ -49,6 +49,7 @@ export type InternalDataTableHeader = Omit<DataTableHeader, 'key' | 'value' | 'c
 export interface DataTableItem<T = any> extends Omit<InternalItem<T>, 'type'>, GroupableItem<T>, SelectableItem {
   key: any
   index: number
+  _virtualIndex?: number
   columns: {
     [key: string]: any
   }