element-plus [Component] [table] el-table tree 设置lazy之后,default-expand-all为true时 不会触发load

epggiuax  于 5个月前  发布在  其他
关注(0)|答案(1)|浏览(129)

Bug Type: Component

Environment

  • Vue Version: 3.2.45
  • Element Plus Version: 2.2.27
  • Browser / OS: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 Safari/537.36
  • Build Tool: Vite

Reproduction

  • el-table

Element Plus Playground

Steps to reproduce

<script setup lang="ts">
import { ref, version as vueVersion } from 'vue'
import { version as EpVersion } from 'element-plus'
import { ElementPlus } from '@element-plus/icons-vue'

const tableData = [
{
id:1,
date: '2016-05-03',
name: 'Tom',
state: 'California',
city: 'Los Angeles',
address: 'No. 189, Grove St, Los Angeles',
zip: 'CA 90036',
},
{
id:2,
date: '2016-05-02',
name: 'Tom',
state: 'California',
city: 'Los Angeles',
address: 'No. 189, Grove St, Los Angeles',
zip: 'CA 90036',
hasChildren: true,
},
{
id:3,
date: '2016-05-04',
name: 'Tom',
state: 'California',
city: 'Los Angeles',
address: 'No. 189, Grove St, Los Angeles',
zip: 'CA 90036',
hasChildren: true,
},
{
id:4,
date: '2016-05-01',
name: 'Tom',
state: 'California',
city: 'Los Angeles',
address: 'No. 189, Grove St, Los Angeles',
zip: 'CA 90036',
},
]

const load = (row,treeNode: unknown,resolve: () => void) => {
setTimeout(() => {
resolve([
{
id:5,
date: '2016-05-01',
name: 'Tom',
state: 'California',
city: 'Los Angeles',
address: 'No. 189, Grove St, Los Angeles',
zip: 'CA 90036',
},
])
}, 1000)
}

</script>

<template>

   <el-table :data="tableData" style="width: 100%" row-key="id" lazy :tree-props="{ children: 'children', hasChildren: 'hasChildren' }" :load="load" :default-expand-all='true'>
    <el-table-column label="Date" prop="date" />
    <el-table-column label="Name" prop="name" />
  </el-table>
</template>

What is Expected?

el-table tree lazy 设置默认default-expand-all为true 或通过按钮点击 修改为true时,触发load事件

What is actually happening?

仅改变了箭头朝向

Additional comments

(empty)

kninwzqo

kninwzqo1#

这种场景可以通过ref调用组件的loadOrToggle来实现:

tableRef.value.store.loadOrToggle(row)

因为涉及到异步请求数据,如果default-expand-all为true,触发所有层级的load,可能会触发很多异步请求,不知道是不是出于这个原因才没有去实现

相关问题