Skip to content
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

[Table] 希望支持 rowSpan colSpan #670

Closed
fashen007 opened this issue Oct 27, 2016 · 23 comments
Closed

[Table] 希望支持 rowSpan colSpan #670

fashen007 opened this issue Oct 27, 2016 · 23 comments

Comments

@fashen007
Copy link

ElementUI version

OS/Browers version

Vue version

Reproduction Link

Steps to reproduce

What is Expected?

希望能支持 类似的 rowSpan colSpan

What is actually happening?

@Eamonnzhang
Copy link

+1

@odayou
Copy link

odayou commented Jun 2, 2017

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

@Aibric
Copy link

Aibric commented Jul 6, 2017

+1

5 similar comments
@geraldlrh
Copy link

+1

@Maplesog
Copy link

+1

@mahuaide
Copy link

+1

@Demon1110
Copy link

+1

@lynzz
Copy link

lynzz commented Aug 11, 2017

+1

@RainingNight
Copy link

+99

@forleve
Copy link

forleve commented Aug 28, 2017

Hope support soon.

@scq000
Copy link

scq000 commented Sep 1, 2017

+1

@isting
Copy link

isting commented Sep 6, 2017

+666

@blogrocks
Copy link

+999

@scq000
Copy link

scq000 commented Sep 9, 2017

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

@a-kriya
Copy link
Contributor

a-kriya commented Sep 28, 2017

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

@huangshuwei
Copy link

huangshuwei commented Sep 30, 2017

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

@Leopoldthecoder
Copy link
Contributor

@Leopoldthecoder Leopoldthecoder moved this from Feature to Done in Table Oct 22, 2017
@a-kriya
Copy link
Contributor

a-kriya commented Oct 23, 2017

@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.

@Leopoldthecoder
Copy link
Contributor

@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.

@a-kriya
Copy link
Contributor

a-kriya commented Oct 24, 2017

@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.

@Leopoldthecoder Leopoldthecoder moved this from @Furybean to DONE in issue tracking Nov 12, 2017
@ablikim915
Copy link

ablikim915 commented Apr 13, 2018

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

@snowdream
Copy link

+1

@mahyuan
Copy link

mahyuan commented May 9, 2019

文档中目前支持的合并单元格仅支持数组元素对象中全是基本类型的情况,多层数组嵌套类型数据的单元格拆分场景建议支持一下,目前业务中该类问题都是通过嵌套一个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'
    }]
}]

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
No open projects
Development

No branches or pull requests