[Feature Request] 希望增加table组件列宽自适应的特性

[Creabine]

Existing Component

是

Component Name

Table

Description

目前的table列宽，只有width,min-width和fit属性。我们的需求是要根据数据循环输出不定列的table，其中有的列内容很多，有的内容很少。

能否增加新特性，使table能像原生表格一样被内容撑开，使得table列宽自适应内容呢？

谢谢：）

[element-bot]

Hi，请问能否提供这个功能或组件的参考链接？

[Creabine]

@element-bot 链接在这里 https://jsfiddle.net/pd7kbqoe/

[lingliMr]

赞同，希望支持！

[lizhengtan]

同求。。。。数据格式不确定时候太丑了。应该是比如在50字以内不会换行，50字以上自动省略最好

[forzalianjunting]

希望支持，数据长度不定时确实很麻烦

[yugasun]

目前个人实现是：

设置一个基准宽度，比如120px，内容转换为字符串长度为20，然后遍历列内容获取最长字符串长度len, 然后计算该列宽度为 120 * len / 20。

但是遍历表格所有内容就有个性能问题，所以这部分计算交给了服务器端，然后接口返回表头数据时，每个表头为一个对象，里面包含有关宽度的属性 col_width 值。

最后补充点个人看法：虽然这个功能的确需求很多，但是仔细想想，如果交给框架，要做到自适应，思路也差不多，一样会遇到性能问题，与其要求框架提供需求，不如自己想办法实现。

[Creabine]

@yugasun 计算字符串长度给相应的宽度是一个思路，我之前也想过但是被否决了，原因如下：
1.前后端交互的数据应该尽可能干净一些，为了一个布局问题去进行计算，再弄脏数据得不偿失；
2.像你说的性能问题，只是把计算从前端转嫁给了后端，大量访问的时候后端压力也会很大；
3.实际上解决这个问题并不需要去计算字符串长度，通过一些css布局就能实现，这是原生表格都支持的特性，不应该舍近求远。

最后，把问题交给后端不算解决了问题，只是一种妥协式的做法。解决问题的思路很好，但是我们希望的是能够有更好的方式去解决他，谢谢你的建议。

[yugasun]

@Creabine 你说的对，我的解决方法的确不太合理，等项目闲下来，要研究下使用css的方式解决，谢谢提醒，如果解决了，可以提个PR试试~

[Creabine]

@yugasun 👍

[jun58]

@Creabine @yugasun 你们用css解决了吗？

[kkzzzzzz]

急需这样的功能

[dingyiming]

急需这样的功能

[YiuTerran]

这个很实用，因为有些列的长度是不固定的，根据内容动态调整比较好。再加上max-width和，show-overflow-tooltip就能完美解决问题

[lifanlingjue]

说拿CSS解决，数据都是异步灌进来的 单凭CSS能取到最长的 然后设宽度吗？况且即使写自适应 但是不同行的相同列 怎么共享一个属性？ 。。。

[yugasun]

的确最终还是css没法解决，还是需要遍历计算，这种功能还是别交给框架了.....

[navono]

CSS加tooltip

[furybean]

Sorry, we have no plan to support this.

[chping2125]

迫切需求

[charleylla]

希望官方支持表格自适应的功能，有些列的数据长度较短，但实际分配宽度时分配的很大

[woodens]

1年了，还是没好的解决办法？

[liuliuboy]

希望官方可以解决

[ddcatgg]

2年了……

[venus6]

从element ui --> element plus 还没有支持吗？非常需要这个功能！

[miqidian]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[13548506407]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[tcp923]

同上 想知道这方面的解决办法出来了吗

[worldstop]

别等了兄弟

[susakin]

凉了

[miqidian]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[13548506407]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[voidzlfan]

现在还是不支持吗？只能先用 min-width 凑合用着先了

[miqidian]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[13548506407]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[Alex-wwei]

我来找答案，支持了吗？哈哈

[miqidian]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[13548506407]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[LovelyAndy]

Do you want to know the solution for this?

Hello, Do you have the solution for this?

[miqidian]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[13548506407]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[13548506407]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[Steve245270533]

这是来自QQ邮箱的假期自动回复邮件。

您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[miqidian]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[13548506407]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[achangchangchang]

2023年了

[miqidian]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[13548506407]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[wudonghe1996]

走远了

[linong71]

看看原生的table，是有这个功能的，只是这里面砍了，css用的是table-layout: fixed，js算了一个自适应的宽度，如果这个宽度不计算，样式改为table-layout: auto，看是否可以解决

[miqidian]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[13548506407]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[zhufeiyao-admin]

我等到23年了 ...

[13548506407]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。