layui table.reload() 默认浅合并 where 参数,旧版(如2.5.5)因 extend(!0, {}, i.config, e) 导致上次字段残留;必须显式传全新、干净的 where: {} 对象并同步清空ui与缓存。

table.reload() 为什么总带着上次的 where 参数
Layui 的 table.reload() 默认不会覆盖历史参数,而是做浅合并——尤其在旧版(如 2.5.5)中,extend(!0, {}, i.config, e) 这种深拷贝写法会导致上一次 where 里的字段被保留。哪怕你只传 {where: {keyword: 'a'}},status、type 等旧字段仍会悄悄带上。
常见错误现象:table.reload('userTable', {where: {keyword: 'test'}}) 发出的请求里却出现 ?keyword=test&status=1&category=all。
- 必须显式传入完整、干净的
where对象,不能依赖“没写就等于没有” - 避免复用同一个对象字面量(比如
const w = {}后反复赋值),防止引用残留 - 如果用了
deep: true,Layui 会主动继承前序参数,此时更要确保每次传的where是全新对象
如何生成真正干净的 where 参数
别靠手动拼,也别用 $.extend({}, oldWhere, newPart)——它不解决字段残留问题。正确做法是只取当前表单真实值,且对空值做明确归零处理。
- 用
new FormData(formEl)提取所有 input/select/textarea 值,再转为对象:Object.fromEntries(new FormData(document.getElementById('searchForm'))) - 对 select 多选、checkbox 等,
FormData会自动处理数组,但后端接收时注意是否需字符串化(如selected_ids: ['1','2'] → selected_ids: '1,2') - 日期控件(laydate)需单独处理:
$('#dateStart').val()取值后,若为空应设为null或'',不能留 undefined - 搜索框内容为空时,建议传
null或''而非删掉字段,避免后端判断逻辑不一致
重载时 page、sort、check 状态怎么不被连带清空
table.reload() 是重建行为,分页、排序、勾选全丢——这不是 bug,是设计如此。但你可以主动捞回来。
- 分页:从
table.config['userTable']?.page读当前curr和limit,reload 时显式传入page: {curr: ..., limit: ...} - 排序:监听
sort(userTable)事件存{field: 'name', type: 'asc'},reload 时用initSort恢复 - 勾选行:调用
table.checkStatus('userTable')提前拿到data数组或ids字段,reload 完用table.checkRow({id: 'userTable'}, {id: xxx})手动勾选(要求表格配置了唯一id字段)
清空 UI 和清空参数必须同步做
只清空 where 不清 DOM,用户看到的还是旧值;只清 DOM 不清 where,一搜又发错请求。二者缺一不可。
- 清 input/textarea:
el.value = '';清 select:el.selectedIndex = 0或用form.val('filterName', {'status': ''})+form.render('select') - 清 laydate:
$('#dateField').val('')+laydate.ins1?.setValue('')(前提是初始化时保存了实例) - 清 checkbox/radio:
form.val('filterName', {'agree': []})+form.render('checkbox') - 最后一步才是
table.reload('userTable', {where: {}, page: {curr: 1}}),且where必须是空对象,不是undefined
最容易被忽略的是:搜索条件可能还藏在 URL query string 或 localStorage 里,reload 前不清理,它们会在初始化或 done 回调里又被自动塞回 where ——这个链路比 DOM 更隐蔽。











