listTable锁定表头

chengdu_lifei

目前版本为3.8的开发平台仍然不支持listTable组件锁定表头，那只能自己改造改造了。废话不多说，直接开整！
1、在listTable上面再拖一个table组件（bootstrap的），把listTable的表头拖进新table中，CSS中添加代码：
table{
        table-layout: fixed;
}
.table{
        width:auto;/**若单元格宽度为百分比，删除此行**/
        margin-bottom: -2px;
}

2、切换到源码，在两个table标签下面添加：<colgroup><col /></colgroup>
3、设置表头单元格和内容单元格的固定宽度，表头最后一列的宽度需要比内容列多17px，因为下面有滑动条，这样更美观
4、给listTable添加style：overflow-y:scroll;display: -webkit-inline-box;height:200px;，其中height可以自己定义
5、如果你的列比较多，需要横向滚动条的话，可以在table外面套两层DIV，div1添加style：overflow-x: scroll;，div2设置固定宽度即可。


整体效果如下：

PS:
如果列宽使用百分比，表头应该多添加一列，最后一列宽度设为17px，这样列才不会错位，如果需要横向滚动，仍需要在table外套两层DIV。

爱我的老鼠

谢谢分享！！！