mirror of
https://gitee.com/element-plus/element-plus.git
synced 2024-12-02 11:17:46 +08:00
docs(components): [table] treeLazy better presentation (#10778)
This commit is contained in:
parent
f48d497a58
commit
75a08b6b3a
@ -7,8 +7,9 @@
|
||||
border
|
||||
default-expand-all
|
||||
>
|
||||
<el-table-column prop="date" label="date" sortable width="180" />
|
||||
<el-table-column prop="name" label="Name" sortable width="180" />
|
||||
<el-table-column prop="date" label="Date" sortable />
|
||||
<el-table-column prop="name" label="Name" sortable />
|
||||
<el-table-column prop="address" label="Address" sortable />
|
||||
</el-table>
|
||||
|
||||
<el-table
|
||||
@ -20,8 +21,9 @@
|
||||
:load="load"
|
||||
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
|
||||
>
|
||||
<el-table-column prop="date" label="Date" width="180" />
|
||||
<el-table-column prop="name" label="Name" width="180" />
|
||||
<el-table-column prop="date" label="Date" />
|
||||
<el-table-column prop="name" label="Name" />
|
||||
<el-table-column prop="address" label="Address" />
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
@ -30,6 +32,7 @@ interface User {
|
||||
id: number
|
||||
date: string
|
||||
name: string
|
||||
address: string
|
||||
hasChildren?: boolean
|
||||
children?: User[]
|
||||
}
|
||||
@ -45,11 +48,13 @@ const load = (
|
||||
id: 31,
|
||||
date: '2016-05-01',
|
||||
name: 'wangxiaohu',
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
},
|
||||
{
|
||||
id: 32,
|
||||
date: '2016-05-01',
|
||||
name: 'wangxiaohu',
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
},
|
||||
])
|
||||
}, 1000)
|
||||
@ -60,26 +65,31 @@ const tableData: User[] = [
|
||||
id: 1,
|
||||
date: '2016-05-02',
|
||||
name: 'wangxiaohu',
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
date: '2016-05-04',
|
||||
name: 'wangxiaohu',
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
date: '2016-05-01',
|
||||
name: 'wangxiaohu',
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
children: [
|
||||
{
|
||||
id: 31,
|
||||
date: '2016-05-01',
|
||||
name: 'wangxiaohu',
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
},
|
||||
{
|
||||
id: 32,
|
||||
date: '2016-05-01',
|
||||
name: 'wangxiaohu',
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
},
|
||||
],
|
||||
},
|
||||
@ -87,6 +97,7 @@ const tableData: User[] = [
|
||||
id: 4,
|
||||
date: '2016-05-03',
|
||||
name: 'wangxiaohu',
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
},
|
||||
]
|
||||
|
||||
@ -95,22 +106,26 @@ const tableData1: User[] = [
|
||||
id: 1,
|
||||
date: '2016-05-02',
|
||||
name: 'wangxiaohu',
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
date: '2016-05-04',
|
||||
name: 'wangxiaohu',
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
date: '2016-05-01',
|
||||
name: 'wangxiaohu',
|
||||
hasChildren: true,
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
date: '2016-05-03',
|
||||
name: 'wangxiaohu',
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
},
|
||||
]
|
||||
</script>
|
||||
|
Loading…
Reference in New Issue
Block a user