layui 表格使用的一点点经验

1、表格高度自适应设置、单元格内容自动换行

.layui-table-cell{
    height:auto;
    overflow:visible;
    text-overflow:inherit;
    white-space:normal;
}

2、tab选项卡切换时，被隐藏掉的tab选项卡的内容中的表格宽度显示不正常

     我的解决办法是在tab选项卡切换时，重载表格

3、表格列宽度根据内容自适应

.layui-table-cell{
    height:auto;
    overflow:visible;
    text-overflow:inherit;
    white-space:nowrap;
    width: auto !important;
}

done: function(res, curr, count){
    if(count == 0){
        $('.layui-table-header').css('overflow','auto');
    };
    //修改固定列tbody的td的高度
    $('.layui-table-main tr').each(function (index ,val) {
        $($('.layui-table-fixed .layui-table-body tbody tr')[index]).height($(val).height());
    });

    //修改表头的宽度
    $('.layui-table-main tr:first-of-type td').each(function (i,v){
    var w = $(v).width();
    var field = $(v).attr('data-field');
    var fieldArr = ['0','from_user','from_county','to_county','to_user','delivery_type','service_type','number','volume','weight','is_print','pay_type','remark','sign_user','order_cancel_me'];
    if($.inArray(field,fieldArr) != -1){
        w = w + 35;
    }
    var px = 'width: '+w+'px !important;';
        $('.layui-table-header th[data-field='+field+'] .layui-table-cell').attr('style',px);
        $('.layui-table-total td[data-field='+field+'] .layui-table-cell').attr('style',px);
        $(v).find('.layui-table-cell').attr('style',px);
    });

    //修改固定列表头的高度
    var headerHeight = $('.layui-table-header').eq(0).height();
     $($('.layui-table-fixed .layui-table-header thead tr')).height(headerHeight);
    }
}