Layui table如何实现根据行数据的值动态渲染单元格图标-Layui教程-PHP中文网

直接在templet函数中根据d字段值返回带状态class的标签字符串即可，需用三元或if/else同步判断，配合外部css控制图标颜色，事件须用委托绑定到表格容器。

直接在 templet 函数里根据 d 数据对象的字段值返回对应图标字符串即可，不需要额外初始化、不依赖 layui.icon()（这函数根本不存在）。

必须用同步、轻量的 JS 判断，不能发请求、不能调用未定义函数、不能操作 DOM。推荐用三元或 if/else 返回完整  标签字符串。

templet: function(d) { return d.status === 'success' ? ' ' : d.status === 'error' ? ' ' : ' '; }
Unicode 字符必须用 HTML 实体写法（如 ），别直接粘贴图标字符，容易乱码
别在函数里写 layui.$(...).css(...) 或访问 layui.table 实例，渲染时会反复执行，卡顿甚至报错

Layui 的  不支持内联 style，但支持加自定义 class，靠外部 CSS 控制样式。

layui手机车牌号码键盘代码是一款基于jQuery跟layui制作的手机端车牌号码输入弹出键盘选择，支持新能源汽车车牌输入格式代码。

下载

在 templet 返回的标签里加上状态 class，比如 class="layui-icon status-success"
在页面或全局样式中补上对应规则：.status-success { color: #52c418; }、.status-error { color: #f5222d; }、.status-warning { color: #faad14; }
漏写 CSS 是最常见问题——图标显示了但颜色全黑，不是代码错了，是样式没加载

templet 渲染出来的  是静态 HTML，直接写 onclick 会污染全局、拿不到 d 数据、分页后失效。

给图标加唯一 class 和 data 属性： 
用事件委托绑定到表格容器：layui.$('#your-table-id').on('click', '.btn-delete', function(){ var id = layui.$(this).data('id'); console.log(id); });
别用 document.querySelector 直接绑，表格重载、翻页后事件就没了

真正容易被忽略的是：templet 函数必须纯计算、无副作用；图标 class 和 CSS 必须成对出现；事件委托的目标容器得是 table.render() 指定的 elem 对应元素，而不是随便一个父级。