Layui Table 的 templet 不支持直接写 if/else 语句

没错，如果你尝试在 templet 里直接写 if (d.status === 1) { ... }，结果多半是报错或者一片空白。这可不是 Bug，而是设计如此：templet 属性接收的是一个字符串或者一个函数，它并不是一个 Ja vaScript 模板引擎，自然不会去解析和执行你写的语句块。

免费影视、动漫、音乐、游戏、小说资源长期稳定更新！ 👉 点此立即查看 👈

那正确的姿势是什么？很简单，把逻辑判断封装进一个函数里，让这个函数来返回最终的 HTML 字符串。

templet: function(d) {
  if (d.status === 1) {
    return '启用';
  } else if (d.status === 0) {
    return '禁用';
  }
  return '未知';
}

访问数据字段时，务必看清 d 的结构

函数里的这个 d，代表当前行的原始数据对象。这里有个关键细节：你访问的字段名，必须和表格列配置 cols 里定义的 field 属性一字不差，包括大小写。如果后端返回的是 user_name，你在函数里却写了 d.userNameundefined。

• 核对字段名：最稳妥的方法是打开浏览器的开发者工具，在 Network 面板查看接口返回的实际数据结构。
• 注意命名风格：下划线、驼峰或者包含空格的字段名，在 templet 里都要原样匹配。
• 处理嵌套属性：对于像 d.user.info.name 这样的深层路径，一定要先判空，否则很容易遇到 “Cannot read property ‘info’ of undefined” 这类错误。

安全的写法应该是这样的：

templet: function(d) {
  return d.user && d.user.info ? d.user.info.name : '-';
}

用三元运算符简化逻辑，但别过度嵌套

对于简单的二值判断（比如启用/禁用、显示/隐藏），三元运算符能让代码看起来更清爽：

templet: function(d) {
  return d.status === 1
    ? '已启用'
    : '已禁用';
}

但是，如果逻辑分支超过两层，继续嵌套三元运算符就会让代码变得难以阅读和维护。比如下面这种写法，就非常不推荐：

// ❌ 尽量避免这种深层嵌套
return d.type === 1 ? 'A' : d.type === 2 ? 'B' : d.type === 3 ? 'C' : 'D';

• 分支过多时：老老实实换回 if/else if/else 结构，清晰度更重要。
• 逻辑复杂时：考虑将处理逻辑提取成一个独立的函数，避免 templet 函数本身过于臃肿。
• 注意引号使用：通常建议 HTML 属性用双引号，Ja vaScript 字符串用单引号包裹，这样可以减少转义字符的困扰。

性能与兼容性：templet 函数会被频繁调用

这一点至关重要：表格渲染多少行，templet 函数就会被执行多少次。如果函数内部执行了 DOM 查询、发起网络请求或者复杂的计算，页面卡顿几乎是必然的。

• 禁止副作用操作：千万不要在 templet 里使用 $.ajax 或 document.querySelector 等操作。
• 数据先行：所有需要展示的数据，都应该在表格的 data 中预先准备好，或者在 done 回调里处理完毕。templet 的职责应该纯粹是“数据到视图的转换”。
• 模板引用：Layui 2.8 及以上版本支持 templet: '#tpl-id' 的写法来引用定义在