diff --git a/components/vc-table/Cell/index.tsx b/components/vc-table/Cell/index.tsx
index 5c54e8f44b..a434defcb1 100644
--- a/components/vc-table/Cell/index.tsx
+++ b/components/vc-table/Cell/index.tsx
@@ -1,8 +1,8 @@
 import classNames from '../../_util/classNames';
 import { filterEmpty, flattenChildren, isValidElement } from '../../_util/props-util';
 import type { CSSProperties, VNodeArrayChildren } from 'vue';
-import { Text, computed, defineComponent, isVNode } from 'vue';
-
+import { Text, computed, defineComponent, isVNode, ref, watch } from 'vue';
+import eagerComputed from '../../_util/eagerComputed';
 import type {
   DataIndex,
   ColumnType,
@@ -22,7 +22,6 @@ import { useInjectHover } from '../context/HoverContext';
 import { useInjectSticky } from '../context/StickyContext';
 import { warning } from '../../vc-util/warning';
 import type { MouseEventHandler } from '../../_util/EventInterface';
-import eagerComputed from '../../_util/eagerComputed';
 import { customRenderSlot } from '../../_util/vnode';
 
 /** Check if cell is in hover range */
@@ -157,6 +156,29 @@ export default defineComponent<CellProps>({
         return vnode;
       }
     };
+
+    // AddEventListener Hover
+    const hoverRef = ref(null);
+    let componentPropsCommonClassName;
+    let additionalProps;
+    let cellPrefixCls;
+    let cellProps: CellType;
+    let cellClassName;
+    watch([rowSpan, startRow, endRow], () => {
+      hoverRef.value?.setAttribute(
+        'class',
+        classNames(
+          cellPrefixCls,
+          {
+            ...componentPropsCommonClassName,
+            [`${cellPrefixCls}-row-hover`]: !cellProps && hovering.value,
+          },
+          additionalProps.class,
+          cellClassName,
+        ),
+      );
+    });
+
     return () => {
       const {
         prefixCls,
@@ -173,7 +195,6 @@ export default defineComponent<CellProps>({
         firstFixRight,
         lastFixRight,
         appendNode = slots.appendNode?.(),
-        additionalProps = {},
         ellipsis,
         align,
         rowType,
@@ -181,10 +202,9 @@ export default defineComponent<CellProps>({
         column = {},
         cellType,
       } = props;
-      const cellPrefixCls = `${prefixCls}-cell`;
-
+      cellPrefixCls = `${prefixCls}-cell`;
+      additionalProps = props.additionalProps ? props.additionalProps : {};
       // ==================== Child Node ====================
-      let cellProps: CellType;
       let childNode;
       const children = slots.default?.();
       if (validateValue(children) || cellType === 'header') {
@@ -273,12 +293,11 @@ export default defineComponent<CellProps>({
         colSpan: cellColSpan,
         rowSpan: cellRowSpan,
         style: cellStyle,
-        class: cellClassName,
         ...restCellProps
       } = cellProps || {};
+      cellClassName = cellProps ? cellProps.class : '';
       const mergedColSpan = (cellColSpan !== undefined ? cellColSpan : colSpan.value) ?? 1;
       const mergedRowSpan = (cellRowSpan !== undefined ? cellRowSpan : rowSpan.value) ?? 1;
-
       if (mergedColSpan === 0 || mergedRowSpan === 0) {
         return null;
       }
@@ -315,6 +334,19 @@ export default defineComponent<CellProps>({
         }
       }
 
+      componentPropsCommonClassName = {
+        [`${cellPrefixCls}-fix-left`]: isFixLeft && supportSticky.value,
+        [`${cellPrefixCls}-fix-left-first`]: firstFixLeft && supportSticky.value,
+        [`${cellPrefixCls}-fix-left-last`]: lastFixLeft && supportSticky.value,
+        [`${cellPrefixCls}-fix-right`]: isFixRight && supportSticky.value,
+        [`${cellPrefixCls}-fix-right-first`]: firstFixRight && supportSticky.value,
+        [`${cellPrefixCls}-fix-right-last`]: lastFixRight && supportSticky.value,
+        [`${cellPrefixCls}-ellipsis`]: ellipsis,
+        [`${cellPrefixCls}-with-append`]: appendNode,
+        [`${cellPrefixCls}-fix-sticky`]:
+          (isFixLeft || isFixRight) && isSticky && supportSticky.value,
+      };
+
       const componentProps = {
         title,
         ...restCellProps,
@@ -323,19 +355,7 @@ export default defineComponent<CellProps>({
         rowSpan: mergedRowSpan !== 1 ? mergedRowSpan : null,
         class: classNames(
           cellPrefixCls,
-          {
-            [`${cellPrefixCls}-fix-left`]: isFixLeft && supportSticky.value,
-            [`${cellPrefixCls}-fix-left-first`]: firstFixLeft && supportSticky.value,
-            [`${cellPrefixCls}-fix-left-last`]: lastFixLeft && supportSticky.value,
-            [`${cellPrefixCls}-fix-right`]: isFixRight && supportSticky.value,
-            [`${cellPrefixCls}-fix-right-first`]: firstFixRight && supportSticky.value,
-            [`${cellPrefixCls}-fix-right-last`]: lastFixRight && supportSticky.value,
-            [`${cellPrefixCls}-ellipsis`]: ellipsis,
-            [`${cellPrefixCls}-with-append`]: appendNode,
-            [`${cellPrefixCls}-fix-sticky`]:
-              (isFixLeft || isFixRight) && isSticky && supportSticky.value,
-            [`${cellPrefixCls}-row-hover`]: !cellProps && hovering.value,
-          },
+          componentPropsCommonClassName,
           additionalProps.class,
           cellClassName,
         ),
@@ -347,7 +367,7 @@ export default defineComponent<CellProps>({
       };
 
       return (
-        <Component {...componentProps}>
+        <Component {...componentProps} ref={hoverRef}>
           {appendNode}
           {childNode}
           {slots.dragHandle?.()}