Fixed #4957 - Datatable: stripedRows do not work correctly with virtual scroll

components/lib/datatable/BodyRow.vue

@@ -33,6 +33,7 @@
             @dragend="onRowDragEnd"
             @drop="onRowDrop"
             v-bind="getBodyRowPTOptions('bodyRow')"
+            :data-p-index="rowIndex"
             :data-p-selectable-row="selectionMode ? true : false"
             :data-p-highlight="selection && isSelected"
             :data-p-highlight-contextmenu="contextMenuSelection && isSelectedWithContextMenu"
@@ -482,7 +483,7 @@ export default {
                 }
             }
 
-            return [this.cx('row', { rowData: this.rowData }), rowStyleClass];
+            return [this.cx('row', { rowData: this.rowData, index: this.rowIndex }), rowStyleClass];
         },
         rowTabindex() {
             if (this.selection === null && (this.selectionMode === 'single' || this.selectionMode === 'multiple')) {

components/lib/datatable/style/DataTableStyle.js

@@ -368,7 +368,7 @@ const classes = {
     rowgroupHeader: 'p-rowgroup-header',
     rowGroupToggler: 'p-row-toggler p-link',
     rowGroupTogglerIcon: 'p-row-toggler-icon',
-    row: ({ instance, props }) => {
+    row: ({ instance, props, index }) => {
         let rowStyleClass = [];
 
         if (props.selectionMode) {
@@ -387,6 +387,8 @@ const classes = {
             });
         }
 
+        rowStyleClass.push(index % 2 === 0 ? 'p-row-even' : 'p-row-odd');
+
         return rowStyleClass;
     },
     rowExpansion: 'p-datatable-row-expansion',