layui/docs/table/detail/options.cols.md

属性名	描述	类型	默认值
field	设置字段名。通常是表格数据列的唯一标识	string	-
title	设置列的标题。	string	-
fieldTitle 2.8+	设置列的字段标题。该属性在筛选列和导出场景中优先级高于 title 属性	string	-
width	设置列宽。若不填写，则自动分配；若填写，则支持值为：数字、百分比。如： width: 200 / width: '30%'	number/string	-
minWidth	设置当前列的最小宽度，一般用于列宽自动分配的情况。其优先级高于基础属性中的 cellMinWidth	number	60
maxWidth 2.8+	设置当前列的最大宽度。其优先级高于基础属性中的 cellMaxWidth	number	-
expandedWidth 2.8.15+	设置单元格被展开后的宽度。若设置的值的小于当前列宽，则展开后的列宽保持不变。注：当 expandedMode 属性为默认值时有效。	number	-
expandedMode 2.8.17+	用于设置所有单元格默认展开方式，可选值有： tips 悬浮展开方式 default 多行展开方式（默认） 优先级高于 cellExpandedMode 基础属性	string	-
type	设置列类型。可选值有： normal 常规列，无需设定 checkbox 复选框列 radio 单选框列 numbers 序号列 space 空列	string	normal
LAY_CHECKED	设置全选状态，当列设置 type: 'checkbox' 时才有效。	boolean	false
fixed	设置固定列，即不跟随 table 横向滚动条而滚动。可选值有： left 固定在左 right 固定在右	string	-
templet	设置列的自定义模板，核心属性。模板遵循 laytpl 组件语法。 templet 提供了三种使用方式，选择任一用法即可： 设置模版选择器 {{! <script type="text/html" id="TPL-demo-title"> <a href="/detail/{{= d.id }}" class="layui-table-link"> {{= d.title }} </a> </script> <!-- 模板中的 `d` 不仅包含当前行数据，还包含特定字段，如： {{= d.LAY_INDEX }} {{= d.LAY_COL }} 等 --> table.render({ cols: [[ {field: 'title', templet: '#TPL-demo-title'} // … ]], // … }); !}} 设置模板内容 该方式必须在内容中包裹一层 <div></div>，否则无法读取模板。 {{! table.render({ cols: [[ {field: 'title', templet: '<div><a href="/detail/{{= d.id }}" class="layui-table-link">{{= d.title }}</a></div>'} // … ]], // … }); !}} 设置模板函数 函数将返回一个 d 参数，包含当前行数据及特定的额外字段。 table.render({ cols: [[ {field: 'title', templet: function(d){ console.log(d); // 得到当前行数据 console.log(this); // 得到表头当前列配置项 console.log(d.LAY_NUM); // 得到序号。或其他特定字段 // 返回模板内容 return '<a href="/detail/'+ d.id +'" class="layui-table-link">'+ d.title +'</a>' }} // … ]], // … });
exportTemplet 2.6.9+	设置表格导出时的模板，用法同 templet 属性。当 templet 指向的模板内容较复杂时建议使用，如下以模板存在 select 元素为例： exportTemplet: function(d, obj){ // 当前 td var td = obj.td(this.field); // 返回 select 选中值 return td.find('select').val(); }
totalRow	是否开启该列的自动合计功能，默认不开启。 采用前端合计 {{! // 开启并输出合计行前端合计结果 totalRow: true // 开启并输出合计行自定义模板。此处 TOTAL_NUMS 即为合计结果的固定特定字段 totalRow: '{{= d.TOTAL_NUMS }} 单位' // 取整或其他运算 totalRow: '{{= parseInt(d.TOTAL_NUMS) }}' !}} // 函数写法(2.9.4+) totalRow: function(obj){ // 内置用于快速实现合计 // obj.field - 当前列字段值 // obj.totalValue - 当前列合计值 // obj.totalData - 所有列合计数据 // 用于自定义列计算 // obj.columnValues - 当前列值的数组 // obj.columnData - 所有列值的数据 // obj.tableData - 当前页所有数据 // 合计格式化 return '合计：' + obj.totalValue + '🥇' // 平均 return '平均分：' + obj.totalValue / obj.columnValues.length } 注意：合计行模板函数写法，与 templet 用法不同，请勿混淆。 采用后端合计 前端合计的数据有限，因此常需要后端直接返回合计结果，组件将优先读取。数据格式如下： { "code": 0, "totalRow": { "score": "777", "experience": "999" }, "data": [{}, {}], "msg": "", "count": 1000 } 在合计行自定义模板中输出后端返回的合计数据 {{! // 获取后端接口返回数据中的统计字段。此处 TOTAL_ROW 即对应返回据中的 totalRow totalRow: '分数：{{= d.TOTAL_ROW.score }}' !}} 如上，在 totalRow 中返回所需统计的列字段名和值即可。 totalRow 字段同样可以通过 parseData 回调来解析成为 table 组件所规定的数据格式。
edit	用于对列所在的单元格开启编辑功能。可选值有： edit: 'text' 单行输入模式 edit: 'textarea' 多行输入模式 2.7+ 函数写法 2.7+ edit: function(d){ // d 即为当前行数据，此时可根据行相关字段来开启该行是否编辑的权限 if(d.editable){ // editable 为任意字段名 return 'text'; // 编辑模式 } }	string function	false
hide	是否初始隐藏列	boolean	false
ignoreExport 2.8.3+	是否导出时忽略该列。支持以下可选值： true : 忽略导出 false : 强制导出，对所有列适用 null : 只对常规列导出（默认）	boolean	-
escape	是否对当前列进行内容编码（转义 html），优先级大于基础属性中的 escape。	boolean	true
sort	是否开启列的排序功能。 注意：不推荐对值同时存在“数字和普通字符”的列开启排序，因为会进入字典序排序计算中，如：'张三' > '2' > '100'，这可能并不是你想要的结果，但字典序排列采用的是 ASCII 码比对。	boolean	false
unresize	是否禁用拖拽列宽。默认情况下会根据列类型 type 属性来决定是否禁用，如复选框列，会自动禁用。而其它普通列，默认允许拖拽列宽，当然你也可以设置 true 来禁用该功能。	boolean	false
event	自定义单元格点击事件名，以便在 单元格工具事件 中完成对该单元格的事件处理。	string	-
style	自定义单元格样式。可传入任意的 CSS 内容，如：style: 'font-size: 13px; color: red;'	string	-
align	单元格排列方式。可选值有：left | center | right	string	left
colspan	单元格所占列数。一般用于多级表头	number	1
rowspan	单元格所占行数。一般用于多级表头	number	1