Bug Type: Component

Environment

• Vue Version: 3.4.0-alpha.1
• Element Plus Version: 2.4.2
• Browser / OS: Edge 120.0.2210.7 / Windows 11 22621.2715
• Build Tool: Vite

Reproduction

Related Component

• el-table-v2

Reproduction Link

Element Plus Playground

Steps to reproduce

Add another div element under a div element, then inherit the width and height of the parent div element through the el-auto-resizer and the template element. Then let the el-table-v2 element obtain the width and height values and add the @end-reached event to the el-table-v2 element to trigger "console.log(123)".
e.g. (I omitted the part of generating data, please ensure that the amount of data passed in is sufficient)

<template>
  <div class="container">
    <div class="result">
      <el-auto-resizer>
        <template #default="{ height, width }">
          <el-table-v2 ref="data-table" :width="width" :height="height" @end-reached="console.log(123)" :columns="columns.map((item: any) =>
({
...item,
width: 150,
align: 'center'
}))" :data="data" fixed />
        </template>
      </el-auto-resizer>
    </div>
  </div>
</template>

Then we ensure that the two div elements have a height of % or vh as their units, and that the height of the table element is sufficient to trigger the @end-reached event. We will find that "console.log(123)" is not triggered. However, when we change the height unit of any of the div elements to px, rem, or other units, the event can be triggered.

What is Expected?

When scrolling to the bottom of the table, the event should be triggered

What is actually happening?

Nothing happened

Additional comments

(empty)