Element: [Table] 希望支持 rowSpan colSpan

Created on 27 Oct 2016  ·  23Comments  ·  Source: ElemeFE/element

ElementUI version

OS/Browers version

Vue version

Reproduction Link

Steps to reproduce

What is Expected?

希望能支持 类似的 rowSpan colSpan

What is actually happening?

feature request

Most helpful comment

我自己写了一个基于vue2.x 的table组件,目前已支持 colSpan 和 rowSpan,感兴趣的可以看下:
http://doc.huangsw.com/vue-easytable/app.html#/table?anchor=table-cell-merge
aa

All 23 comments

+1

+1
合并行这种场景还是比较常见的.
官方忙不过来,有没有大神贡献下这个特性

+1

+1

+1

+1

+1

+1

+99

Hope support soon.

+1

+666

+999

由于目前还不支持这个功能,所以我改了它的源码,能实现自己想要的需求。有需要的,可以拿去参考一下:https://github.com/scq000/vue-element-enhanced-table

There is another related ticket that is tagged "in plan." Would the feature, how it is currently planned, provide the ability to do something like the following? Perhaps passing in an attribute (render function) to the Table component that will be called for every row, and allow the user to modify the row (change td/append or prepend another row). If this is not how it is currently planned, would another feature request for this be acceptable?

image

我自己写了一个基于vue2.x 的table组件,目前已支持 colSpan 和 rowSpan,感兴趣的可以看下:
http://doc.huangsw.com/vue-easytable/app.html#/table?anchor=table-cell-merge
aa

Added in 2.0: http://element.eleme.io/2.0/#/zh-CN/component/table#he-bing-xing-huo-lie

@Leopoldthecoder Would you mind if I created another feature request to have a way to insert divider rows for grouping the data, something similar to the table in my previous comment above? The way it is implemented in 2.0 would require the divider row to be present in the bound data itself, but there may be instances where that would not be semantically correct.

@syn-zeta Having something like divider rows seems a little verbose to me, since ultimately it renders a full-span row that can be done with the current implementation.

@Leopoldthecoder Right, it can be done with the current implementation, but that would require the "grouping criteria" to be part of the data itself. So, the date would exist as the serial number property in the above image, which seems like a hack. Perhaps a generic way to group data may be useful to enough users in the future to consider this.

我在合并行列上遇到问题了 哪位可以帮我看下问题? #10702

+1

文档中目前支持的合并单元格仅支持数组元素对象中全是基本类型的情况,多层数组嵌套类型数据的单元格拆分场景建议支持一下,目前业务中该类问题都是通过嵌套一个el-table解决的,但是边距边框处理与element原生的样式没有很好的兼容

// 支持的数据类型
[{
    id: '12987122',
    name: '王小虎',
    amount1: '234',
    amount2: '3.2',
    amount3: 10
}, {
    id: '12987123',
    name: '王小虎',
    amount1: '165',
    amount2: '4.43',
    amount3: 12
}, {
    id: '12987124',
    name: '王小虎',
    amount1: '324',
    amount2: '1.9',
    amount3: 9
}]

// 多层嵌套的数据类型
[{
    id: '12987122',
    name: '王小虎',
    content: [{
        item: '23x2',
        title: 'd3434',
        img: 'http://34dd.png'
    }]
}, {
    id: '12987123',
    name: '王小虎',
    content: [{
        item: '23x2',
        title: 'd3434',
        img: 'http://34dd.png'
    }]
}, {
    id: '12987124',
    name: '王小虎',
    content: [{
        item: '23x2',
        title: 'd3434',
        img: 'http://34dd.png'
    }]
}]
Was this page helpful?
0 / 5 - 0 ratings