Layui table图片懒加载需用flow.lazyimg()手动接管，核心是将img的src设为空或占位符、data-src存真实URL，并在table.done回调中调用flow.lazyimg()监听对应img元素。
layui table 图片列怎么触发懒加载
原生 layui.table 不支持图片懒加载，必须靠 flow.lazyimg() 手动接管。关键不是改表格配置，而是把图片的 src 换成占位符（如空字符串或 base64 小图），再用 data-src 存真实地址，等滚动进可视区才赋值。
为什么直接写 src 会导致全部图片一次性加载
浏览器遇到 <img src="xxx.jpg"> 会立刻发起请求，不管是否在视口内。Layui 表格渲染完 DOM 后，所有 img 标签已存在，flow.lazyimg() 来不及拦截——它只扫描初始化时已存在的 data-src 元素。
- 表格列必须用
templet控制输出，不能直接写死src - 正确写法示例：
<img src="" alt="{d.alt}"> - 如果后端没提供
bigImgUrl，前端得在done回调里遍历res.data补上，别依赖模板字符串硬编码
flow.lazyimg() 怎么和 table 渲染时机配合
flow.lazyimg() 必须在表格 DOM 完全渲染后调用，且每次 table.reload() 或动态追加行后，都要重新执行一次——否则新插入的图片不会被监听。
- 首次渲染：在
table.render()的done回调末尾加flow.lazyimg({elem: '#yourTable img'}); - 后续 reload：在
table.reload()的done里同样调用，不要省略 - 避免重复绑定：
elem传具体选择器（如'#alarmTable img[data-src]'），别用全局'img' - 移动端 Safari 需补样式：
.layui-table-body { -webkit-overflow-scrolling: touch; }，否则滚动检测失效
常见失效原因和验证方法
图片不动、控制台没报错，但就是不加载——大概率是路径或时机问题。
- 打开 Network 面板，筛选
img请求，看懒加载触发后有没有发新请求；没有说明data-src没被识别 - 检查元素：
img上是否有data-src属性，且值是可访问的 URL（右键“在新标签页打开”试试） - 确认
flow模块已引入：layui.use(['table', 'flow'], function(){...})，漏掉flow就白配 - 如果用了自定义 class 包裹图片（如
<div class="thumb"><img ...></div>），flow.lazyimg()默认不处理，得手动加data-src到img上，不是父容器
img 带有效 data-src → flow.lazyimg() 精确作用于这批 img → 容器有可滚动区域且高度固定。少一个环节，图片就卡在 placeholder 上。
