表格初始化必须用 table.render 而非 table.init，需显式传入 url 和 page；cols 按钮须用 lay-event 绑定；form 提交前须手动校验；编辑数据应修改 table.cache 后 reload；删除须二次确认并收集全量选中 ID。
表格初始化时必须用 render 而非直接 init
很多人在首次加载表格时直接调用 table.init，结果数据不渲染、工具栏按钮失效——这是因 layui 2.8+ 已废弃该方法，table.render 才是唯一正确入口。它会自动绑定分页、排序、事件监听等基础能力。
关键点：必须显式传入 url（接口地址）和 page（开启分页），否则即使后端返回了数据，前端也只显示 loading 状态。
-
url必须是真实可访问的接口，且返回格式严格符合{code: 0, count: N, data: [...]} - 若用 mock 数据，需手动包装成该结构，不能直接返回数组
-
cols中每个字段的templet若含按钮，必须用lay-event属性绑定事件名，如lay-event="edit"
新增弹窗里表单提交前要手动校验 form.verify
Layui 的 form.on('submit(...)') 不会自动拦截空值或格式错误，提交后才触发后端校验，用户体验差。必须在点击「确定」前主动调用 form.verify 并检查返回值。
常见坑：form.verify 的回调函数里不能用 return false 中断流程，而应通过 layer.msg 提示 + return 提前退出函数体。
- 定义规则时，key 名需与
input name完全一致，大小写敏感 - 异步校验（如用户名是否已存在）要用
ajax+done回调，不能直接return - 弹窗表单建议用
form.render('select')补充渲染下拉框，否则form.val取不到值
编辑行数据时别直接改 data 数组，要用 table.cache + table.reload
直接修改 table.cache['id'] 中某项再调用 table.reload 是最稳妥的更新方式。有人尝试用 layui.jquery(...).text() 直接改 DOM，结果排序/分页后内容丢失，因为 Layui 表格的数据源只认 cache 和接口响应。
前端设计与 UI/UX 全方位优化专家。覆盖视觉层次、排版系统、色彩理论、响应式布局、交互体验、动画动效、无障碍访问、性能优化八大维度，帮助开发者将普通页面升级为高品质产品级界面。前端设计与 UI/UX 全方位优化专家。覆盖视觉层次、排版系统、色彩理论、响应式布局、交互体验、动画动效、无障碍访问、性能优化八大维度，帮助开发者将普通页面升级为高品质产品级界面。
立即学习“前端免费学习笔记（深入）”；
注意：如果启用了 height 或 limit，reload 时必须把原参数一并传入，否则分页器重置、高度失效。
- 获取当前行数据用
obj.tr.data('index')拿到索引，再查table.cache['id'][index] - 更新后 reload 需带
where参数同步搜索条件，否则翻页后搜不到刚改的记录 - 避免在
tool事件里嵌套layer.open后立刻 reload，应等用户关闭弹窗再执行
删除操作必须加二次确认且禁用批量删的默认行为
默认的 table.checkStatus 返回的是当前页选中项，不是全量数据选中状态。如果用户翻页后勾选多页，直接删会漏数据。更危险的是，没加 layer.confirm 就发请求，误点即丢数据。
真正安全的做法是：每次删都走单条 ID 请求；批量删则先收集所有页的选中 ID（需自己维护一个全局数组），再统一提交。
- 单删按钮的
lay-event值要和tool监听事件里的字符串完全一致 - 删除成功后，用
obj.del()删除当前行 DOM，比 reload 更快更稳 - 不要依赖
data.length判断是否为空，Layui 分页下data永远是当前页数据，应查count
field 不一致、时间戳没转格式、弹窗里 form.on 绑定时机不对——这些问题不会报错，但交互就卡住不动。 
