-
Notifications
You must be signed in to change notification settings - Fork 36
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
多级表头+复选框+序号列同时使用,加载表格时会丢失复选框和序号 #55
Comments
方便写个demo吗 |
// complex1.vue
<template>
<div>
<virtual-scroll
ref="virtualScroll"
:data="list"
:item-size="62"
key-prop="id"
@change="(virtualList) => tableData = virtualList">
<el-table
:data="tableData"
height="800"
row-key="id"
style="width: 100%">
<virtual-column fixed width="60" type="selection"></virtual-column>
<virtual-column fixed label="索引" width="80" type="index"></virtual-column>
<virtual-column type="expand" >
<template slot-scope="scope">
{{ scope.row.text }}
</template>
</virtual-column>
<el-table-column
prop="date"
label="日期"
width="150">
</el-table-column>
<template v-for="(column, index) in columns">
<ComplexColum
:column="column"
:key="index">
</ComplexColum>
</template>
</el-table>
</virtual-scroll>
</div>
</template>
<script>
import VirtualScroll, { VirtualColumn } from 'el-table-virtual-scroll'
import { mockData } from '@/utils'
import ComplexColum from './complexColum1'
export default {
components: {
VirtualScroll,
VirtualColumn,
ComplexColum
},
data () {
return {
list: mockData(0, 2000),
tableData: [],
columns: [
{
title: '内容',
prop: 'text',
width: 400
},
{
title: '合并列',
columns: [
{
width: 200,
title: '地址',
prop: 'address'
},
{
width: 200,
title: '名称',
prop: 'name'
},
{
width: 100,
title: 'id',
prop: 'id'
}
]
},
{
title: '内容2',
prop: 'text2',
width: 400,
},
{
title: '名称',
prop: 'name'
}
]
}
},
methods: {
},
created () {
}
}
</script>
<style lang='less' scoped>
</style>
// complexColum1.vue
<template>
<el-table-column :width="column.width">
<template slot="header">
{{ column.title }}
</template>
<template slot-scope="{row}">
{{ row[column.prop] }}
</template>
<template v-for="(child, index) in column.columns">
<component
:is="'Child'"
:key="index"
:column="child">
</component>
</template>
</el-table-column>
</template>
<script>
export default {
name: 'complex-colunm',
props: {
column: {
type: Object
}
},
beforeCreate () {
this.$options.components.Child = require('./complexColum1').default
}
}
</script>
<style lang='less' scoped>
</style>
|
好的,我再研究研究 |
ok,有问题再@我 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
20231221-181245.mp4
不知道是不是嵌套生成的原因
![image](https://private-user-images.githubusercontent.com/129500235/292170511-8d1adad6-de30-4540-89b7-29760b55b441.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjEzOTcxMzksIm5iZiI6MTcyMTM5NjgzOSwicGF0aCI6Ii8xMjk1MDAyMzUvMjkyMTcwNTExLThkMWFkYWQ2LWRlMzAtNDU0MC04OWI3LTI5NzYwYjU1YjQ0MS5wbmc_WC1BbXotQWxnb3JpdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ3JlZGVudGlhbD1BS0lBVkNPRFlMU0E1M1BRSzRaQSUyRjIwMjQwNzE5JTJGdXMtZWFzdC0xJTJGczMlMkZhd3M0X3JlcXVlc3QmWC1BbXotRGF0ZT0yMDI0MDcxOVQxMzQ3MTlaJlgtQW16LUV4cGlyZXM9MzAwJlgtQW16LVNpZ25hdHVyZT03MWRkMmJhYTQ3MmVkMGQ3ZDQ2ZGM4NDU2NjRjM2EzMDI5MmRjYWMwNDU5ZTBhMTVmM2EzYTcxMjQ1ZTcyOWY1JlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCZhY3Rvcl9pZD0wJmtleV9pZD0wJnJlcG9faWQ9MCJ9.0YyoiU98EjKhmAFw6f3fcXdTo5XJvAyXnSZvqOIz2NU)
![image](https://private-user-images.githubusercontent.com/129500235/292170572-b328641b-4393-431c-b0f7-d619b045871d.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjEzOTcxMzksIm5iZiI6MTcyMTM5NjgzOSwicGF0aCI6Ii8xMjk1MDAyMzUvMjkyMTcwNTcyLWIzMjg2NDFiLTQzOTMtNDMxYy1iMGY3LWQ2MTliMDQ1ODcxZC5wbmc_WC1BbXotQWxnb3JpdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ3JlZGVudGlhbD1BS0lBVkNPRFlMU0E1M1BRSzRaQSUyRjIwMjQwNzE5JTJGdXMtZWFzdC0xJTJGczMlMkZhd3M0X3JlcXVlc3QmWC1BbXotRGF0ZT0yMDI0MDcxOVQxMzQ3MTlaJlgtQW16LUV4cGlyZXM9MzAwJlgtQW16LVNpZ25hdHVyZT1kODUzMWUwNzUzMWI5ZTQzN2UwM2UxNThjYTg5NTUzNDM4ODk1YWEyYzUyYWM2Mzk5ODQyNTdiODQ3NGQwZjEyJlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCZhY3Rvcl9pZD0wJmtleV9pZD0wJnJlcG9faWQ9MCJ9.ilG8a-FXu8uxtrAi0bSRdLvcSImC_cJnINA55H42Lqk)
这样没问题
这样就有问题
有没有正确的使用示例
The text was updated successfully, but these errors were encountered: