Layui表格中Iconfont图标渲染失败主因是templet默认转义HTML，需用函数模板返回未转义字符串；须确保CSS全局加载、类名匹配、事件委托绑定，并注意字体渲染样式与多色图标兼容性。
表格列中直接渲染 Iconfont 图标失败？
不是图标不显示，而是 layui 的 templet 渲染时默认对 html 转义， 会被当成纯文本输出。必须显式启用未转义渲染。
- 在列定义里加
templet: function(d) { return ''; }，不能写成字符串模板templet: '' - Layui v2.8+ 支持
unresize: true等新字段，但templet函数仍是唯一可靠方式 - 确保 Iconfont CSS 已全局加载（比如在
中引入），且类名与字体文件定义一致，常见错是把icon-user写成icon-user-fill但 CSS 里没这个规则
用数据字段动态控制 Iconfont 图标类型
图标常需根据状态切换，比如 status: 1 显示勾，status: 0 显示叉。靠硬编码 class 不现实，得靠函数动态拼接。
- templet 函数内用
d.status === 1 ? 'icon-ok' : 'icon-close'判断，别漏掉引号 - 避免在 templet 里调用异步方法（如
axios.get），Layui 表格渲染是同步的，异步返回时 DOM 早渲染完了 - 图标类名建议统一前缀（如
if-xxx），防止和项目其他 icon 库冲突；Iconfont 项目生成的 CSS 里若用了.icon-*，就别再用同名 class 做业务语义
图标点击后事件绑定失效？
表格重绘（如分页、搜索、reload）后，原绑定的 click 事件会丢失——因为 DOM 被替换了。直接写 onclick="xxx()" 在 templet 里也不推荐，维护性差且容易 XSS。
- 用
table.on('tool(yourTableId)', function(obj){...})监听工具栏事件，这是 Layui 官方支持的委托方式 - 若图标不在 toolbar 列，而是普通列，改用
$(document).on('click', '.icon-edit', function(){...})，注意选择器要带命名空间或唯一 class - 别在 templet 里写
onclick="editUser("+d.id+")"，双引号嵌套易出错，也难 debug；优先用data-id属性存值，事件里读取
图标在移动端缩放异常或模糊
Iconfont 本质是字体，依赖 font-size 和 line-height。Layui 表格行高默认紧凑，小屏下图标可能被裁剪或发虚。
- 给图标加
style="font-size: 14px; line-height: 1;"，别只设 font-size，line-height 不匹配会导致垂直偏移 - 检查 Iconfont 项目是否启用了「多色图标」，多色图标实际是 SVG，不走字体渲染路径，此时
标签无效，得换用+ symbol 引用 - 如果用了 Webpack 或 Vite，确认 Iconfont 的
.woff2文件被正确打包并可访问，404 时图标会退化为空心方块
Layui 表格本身不干预图标渲染逻辑，真正卡点永远在三处：HTML 是否被转义、CSS 是否生效、事件是否委托正确。尤其注意 Iconfont 的 class 名和实际字体文件的映射关系——改了项目配置却忘了更新 CSS 链接，是最隐蔽的坑。
