layui 动态生成表格单元格根据条件渲染背景色

一、动态表格

关键点：

1. Object.keys(data.data[0])获取所需要的表头字段；
2. colss.push({ align: ‘center’, title: arr[0], colspan: 2 });push cols 所需要的格式到数组里，其中field使用步骤1所得到的；
3. cols: [[]]根据固定格式，传入参数cols: [colss, colsData]
4. 注意步骤3，对于colspan=1的设置，需要增加空白行{ title: '', field: '', hide: true };不然会出现thead与tbody不对应；

二、单元格条件渲染

done 时渲染

1. 定位单元格，lay-id是对应table.render()中的id；
2. 动态声明变量
3. let attrName = 'role' + i;vars[attrName] = $(tr[i]).text().split('%');
4. $().css()进行渲染，多个值使用{'Cname':'value','Cname':'value'}

三、效果图

$('.layui-table-view[lay-id="dcTableFuc2"]').children('.layui-table-box').children('.layui-table-body').find('table tbody tr[data-index="0"] td')

function dcTableFuc2() {
   
      $.ajax({
   
      url: '',
      type: "",
      data: {
   },
      dataType: "json",
      success: function (data) {
   
          var colss = [];
          var colsData = [];
          //4.将数据转换为Object类型
          var keys = Object.keys(data.data[0])
          var lineOne = data.header[0];
          var dataList = data.data[0];
          var dataArr =