关于iview Element table 自适应列宽问题

Vue + iview-ui 遇到 iview内的table没有原生table那种列宽自适应功能,在iview table API中并没有找到自适应的接口

table.png同样，Element table虽然拥有 fit 这个属性但是使用上并没发现有任何作用，在Element官方github上issue #4159 大部分人讨论方向都是通过遍历计算每列最大宽度，但是当数据多的时候性能会受到影响。后来官方关掉了这个票，需要开发人员自行解决

不管是Element还是iview 针对table的封装，都会自动加入colgroup col 标签,并且对table加上table-layout: fixed已达到固定列宽的功能，反之若没有这两个条件，那么table自然就和原生table一样拥有自适应列宽的功能。

1. 从css角度上 把colgroup col标签要屏蔽掉并且table 的table-layout: fixed css属性还原成auto就达到了列宽自适应的功能。

 

加上这两个css后table便可以自适应列宽了，需要的话可以再加上个列最小宽度，防止空值情况表头被挤。

1. 但是 由于某些复杂功能的原因 iview和Element的 table的构建表头thead 和tbody是分开的两个table，所以会出现自适应宽度头身不等情况。有一种处理方法是在tbody自适应后的每一列宽度赋给表头thead