layui table.reload() 仅识别 where 字段,其他参数被忽略;必须使用 where: { key: val } 格式,且需动态过滤空值、重置 page.curr 为 1,post 模式下后端需支持 json 解析。
table.reload() 只认 where 字段,其他字段全被忽略——这是 layui 的设计逻辑,不是 bug。
reload 传参必须走 where,否则后端收不到
你不能写 table.reload('id', { keyword: 'abc' }),这样 keyword 不会出现在请求参数里。真正生效的只有配置对象中的 where 属性,它必须是对象,且会被合并进 URL query(GET)或 JSON body(POST)。
- 错误写法:
table.reload('userTable', { search: 'test' })→ 接口收不到search - 正确写法:
table.reload('userTable', { where: { keyword: 'test' } }) -
where不能为空字符串、null或undefined,否则仍沿用上次缓存值;只有where: {}才算清空 - POST 模式下,后端需支持解析原始 JSON(如 Express 要配
bodyParser.json())
搜索条件为空时怎么避免传给后端
用户没输关键词、状态选了“全部”,但你把 { keyword: '', status: '' } 塞进 where,后端可能误判为“查空字符串”,导致 SQL 异常或缓存命中。
- 动态构建
where:只添加非空/有效值,例如if (val) params.keyword = val - 下拉框“全部”建议设
value=""或null,再统一过滤 falsy 值 - 日期控件返回
"2024-01-01",后端要"2024/01-01"就得先格式化 - 用
new FormData(formEl)收集表单时,记得Object.fromEntries()后再删空字段
重载后页码还停在第 5 页?必须显式重置 page.curr
用户在第 5 页搜了个词,reload 后不带 page: { curr: 1 },请求仍发 page=5,结果返回空数组,UI 显示「第 5 页 / 共 0 页」——这是最常被忽略的视觉错乱点。
- 每次涉及搜索、排序、重置等条件变更,都必须加
page: { curr: 1 } - 老版本 Layui(2.5.6 之前)对
page.curr处理有 bug,建议升级到 2.8+ 或手动加该配置 - 别依赖
tableIns.config.page.curr读取当前页——它可能还没更新,直接写死{ curr: 1 }最稳妥
自定义参数名要用函数式 where,别写死对象
后端接口要的是 q_name、status_code,而不是默认的 keyword,就得让 where 是函数,每次重载时重新取值。
- 初始化时写:
where: () => ({ q_name: $('#search-name').val().trim(), status_code: $('#status-select').val() }) - reload 时也得传函数,或传新对象:
where: { q_name: val, status_code: statusVal } - 别在
where函数里调用table.reload(),会触发无限循环 - 多个搜索控件(输入框、下拉、日期)都要监听
change或keyup,实时同步到一个全局对象(如window.searchWhere),再拼进where
真正容易被忽略的不是语法,而是:每次 reload 都得新建 where 对象,而不是反复修改同一个引用;page.curr 必须重置;空值必须过滤——这三件事漏掉任何一项,都会导致数据错乱或接口异常。











