layui table组件宽度设置

开源框架Pear Admin，LayUI版本2.7.0.rc-5。

layui的table组件-基础参数-cellMinWidth可以设置最小宽度，表头参数可以设置width，以上可以适用大部分表格展示。

如今遇到一个需求，需要表格内容自适应，由单元格撑开宽度，找了api没有发现实现参数。

度娘未果，以下代码是自己实现的，如有问题请指正。

注意：字段较少时，请不要这样使用，直接设置宽度，不然表格内容会塌陷。

逻辑简单粗暴，关键参数（不是layui指定的参数，但是可以识别，layui指定设置数字和百分比）

cellMinWidth: 'auto'

 然后根据表格内容宽度设置表头宽度（layui数据和表头是两个‘table’）。

1. html页面

<table id="topic-table" lay-filter="topic-table"></table>

 2. js代码

// 字段内容省略
var cols = [{}];

// 表格渲染
table.render({
  elem: '#topic-table',
  url: ctx + 'topic/table',
  loading: true,
  height: 'full-65',
  page: true,
  cols: cols,
  skin: 'row,line',
  even: true,
  cellMinWidth: 'auto',
  toolbar: '#topic-toolbar',
  defaultToolbar: [{
    title: '刷新',
    layEvent: 'refresh',
    icon: 'layui-icon-refresh'
  }],
  done: function (res, curr, count) {
    var $data = $('div[lay-id="topic-table"]').find('.layui-table-body').find('tr').eq(0).find('td');
    var $head = $('div[lay-id="topic-table"]').find('.layui-table-header').find('tr').eq(0).find('th');
    for (var i = 0; i < $data.length; i++) {
      var l1 = $data.eq(i).find('div').width();
      var l2 = $head.eq(i).find('div').width();
      if (l1 > l2) {
        $head.eq(i).find('div').width(l1);
      } else {
        $data.eq(i).find('div').width(l2);
      }
    }
  }
});

3. 实现效果