element-plus [Bug Report] [Component] [table] 无数据时,#default="scope"会执行一次;当给列添加width属性后,#default="scope"会执行多次

3mpgtkmj  于 5个月前  发布在  其他
关注(0)|答案(3)|浏览(97)

Element Plus version

2.2.26

OS/Browsers version

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Safari/537.36

Vue version

3.2.36

https://codepen.io/yilingsj/pen/oNymEZe

Steps to reproduce

1、打开控制台,然后刷新页面;

2、点击“插入一条数据”按钮;

What is Expected?

1、表格初始化无数据时,getScopeRow()方法不应该被调用;

2、当点击“插入一条数据”按钮时,getScopeRow:打印次数为当前表格数据的长度;

What is actually happening?

1、表格初始化无数据,但methods中定义的getScopeRow()方法会被调用。打开控制台,此时会有一条日志:getScopeRow: {} ;row.name= undefined ;row.price= undefined;
如下图↓↓↓

2、当点击“插入一条数据”按钮,getScopeRow:会打印多次;
如下图↓↓↓

flvtvl50

flvtvl501#

我还以为是自己的问题,原来大家都有,但是我遇到一个问题,使用插槽的时候,例如这一行数据我有一列字段为attendResult的值是数组,那么如果我使用v-for配合el-table-column就什么都不显示,控制台打印出来正常
<el-table-column v-for="(x,index) in formatAttendanceResult(scope.row.attendResult)" :key="index" :label="x.date" width="110"> {{x.value}} </el-table-column>

vybvopom

vybvopom2#

我也是服啦, 4 个节点调用了 22 次

zaq34kh6

zaq34kh63#

我也碰到同样的疑惑,这是个必现的bug。当前最新版2.3.4仍存在。

el-table-column 初始化时调用默认插槽获取具体的插槽VNode结构,此时 scope === { row: {}, column: {}, $index: -1 } 。这样会带来一些非预期的问题,比如读取row的深层数据必然会报错。

to: 源码

相关问题