Layui表格中渲染二维码需在done回调内用setTimeout(() => { ... }, 0)延后执行，确保DOM挂载后再调用qrcode.js的render方法，容器须为宽高固定的空div元素。
layui table 的 templet 里怎么渲染二维码图片
直接在 templet 函数里用 qrcode.js 动态生成是行不通的——layui 表格渲染时单元格 dom 尚未挂载，qrcode.js 的 render 方法找不到目标容器，会静默失败或报 cannot read property 'appendchild' of null。
正确做法是等表格完成渲染、单元格真实存在于 DOM 中后，再逐个生成二维码。Layui 提供了 done 回调，但注意：它只保证表格结构渲染完成，不保证所有 templet 内容已插入（尤其带异步或延迟操作时）。所以更稳妥的是用 setTimeout 微任务延后执行，或监听 layui.table.on('rendered') 事件（需 Layui 2.8+）。
- 推荐在
done回调里用setTimeout(() => { ... }, 0)触发二维码绘制 - 每个单元格需有唯一标识（如
data-id或固定 class），避免重复渲染 - 二维码容器必须是空的
，不能是或——qrcode.js依赖appendChild
用 qrcode.js 还是 canvas 原生绘图
qrcode.js（如 davidshimjs/qrcodejs）最轻量，无依赖，适合纯前端生成；但它不支持 logo、颜色定制、高纠错等级等高级功能。如果只是展示基础 URL 或文本二维码，够用；若需嵌入图标、调整边距或兼容 IE11，得换 qrcode-generator 或 canvas 手动 drawImage。
-
qrcode.js的render方法只接受 DOM 元素，不返回 canvas，无法二次加工 - 用
qrcode-generator可先生成canvas，再转data-url赋给 - Layui 表格单元格高度默认紧凑，记得给二维码容器设
width和height（如100px），否则可能被压缩变形
表格重载（table.reload()）后二维码消失怎么办
这是最常踩的坑：调用 table.reload() 后，DOM 重建，之前生成的二维码 canvas 全部丢失，但 done 回调不会自动再次触发二维码逻辑。
- 必须把二维码生成逻辑封装成独立函数（如
renderQrCode(el, text)），并在每次done里显式调用 - 不要在
templet里写new QRCode(...)—— 每次渲染都新建实例，且无法清理旧实例，内存泄漏风险高 - 如果用了分页，
done会在每页切换时触发，确保只处理当前页可见行（可用layui.$(tr).is(':visible')过滤）
移动端扫码模糊、识别率低的几个硬伤
不是二维码本身问题，而是 Layui 表格在手机上默认缩放、像素比适配没处理好。常见现象：二维码看着小、边缘锯齿、扫不出来。
- 务必设置容器
style="image-rendering: -webkit-optimize-contrast;"（iOS Safari 专用） - 二维码尺寸建议 ≥ 150×150 px，用
width: 150px; height: 150px;显式声明，别依赖百分比 - 避免用
background-image方式渲染二维码图片——背景图会被缩放裁剪，且无法长按保存 - 测试时用真机扫码，微信内置浏览器对 canvas 渲染的二维码兼容性最好；UC、QQ 浏览器可能需要加
canvas.style.imageRendering = 'pixelated'
Layui 表格里塞二维码，核心就两点：时机（DOM 存在后再画）、容器（必须是可 appendChild 的块级空元素）。其它都是围绕这两点打补丁。
