Layui表格数据清洗必须在parseData中统一处理，它是唯一可控入口，确保分页、嵌套字段、where参数等正常；reload时需显式传入parseData函数，否则清洗失效。
直接在 parsedata 里做清洗，别绕到 reload 或手动改 table.cache —— 否则分页错乱、嵌套字段取不到、where 参数丢失都是常态。
parseData 是唯一可控的清洗入口
Layui 表格只在首次渲染或 reload 时调用 parseData，它接收原始响应（无论后端是数组、对象还是带包装的结构），必须返回符合 Layui 规范的 { code, msg, count, data } 对象。清洗逻辑放这里，才能确保所有后续行为（分页、排序、列模板渲染）基于清洗后的数据运行。
常见错误现象：table.reload({ where: { q: 'xxx' } }) 后发现日期字段还是字符串、null 值没转成 '-'、嵌套对象没扁平化 —— 这是因为你把清洗逻辑写在了 AJAX 成功回调里，而表格压根没走 parseData。
-
parseData必须返回data字段为数组，哪怕空数组也要显式写data: [] - 嵌套字段如
{{d.university.universityNameEN}}要求原始响应中d.university确实存在且非null，清洗时得补默认值或过滤掉脏数据 - 如果后端返回的是
{ result: [...], total: 123 }，parseData就得解构：return { count: res.total, data: res.result || [] }
清洗 null / undefined / 空字符串字段
前端展示时，null 或 undefined 会导致模板渲染空白甚至报错（比如 {{d.user.name}} 中 d.user 为 null）。不能依赖模板里加三元判断，那会污染视图层，且分页统计数可能出错。
清洗应统一在 parseData 内完成：
parseData: function(res) {
const cleanItem = (item) => {
// 遍历字段，替换 null/undefined 为空字符串
Object.keys(item).forEach(key => {
if (item[key] == null) item[key] = '';
// 处理嵌套：如 countryId → country?.countryName
if (key === 'countryId' && item.country && typeof item.country === 'object') {
item.countryName = item.country.countryName || '-';
}
});
return item;
};
return {
code: 0,
msg: '',
count: res.count || res.length || 0,
data: Array.isArray(res.data) ? res.data.map(cleanItem) : []
};
}
- 避免在
templet里写{{ d.user ? d.user.name : '-' }}—— 模板应专注展示，不承担数据兜底 - 如果字段需格式化（如时间戳转 YYYY-MM-DD），也放在这里做，而不是靠
templet里的laydate.render或 moment 格式化 - 注意：清洗后必须保证
data是纯数组，不能返回Promise或异步操作，parseData是同步函数
reload 时如何复用同一套清洗逻辑
table.reload() 默认不会重新执行初始化时的 parseData，除非你显式传入。很多人以为 reload 会“继承”原配置，其实不会 —— 它只合并你传的参数，未传的仍用初始值，但 parseData 不在合并范围内。
正确做法是：把清洗函数抽出来，在 render 和 reload 中都引用它：
const cleanResponse = (res) => {
// 同上 cleanItem + 统一结构封装
return { code: 0, msg: '', count: res.total, data: (res.list || []).map(cleanItem) };
};
// 初始化
table.render({
elem: '#demo',
url: '/info/list',
parseData: cleanResponse,
// ...
});
// 查询重载
form.on('submit(user-query)', function(obj){
table.reload('demo', {
where: obj.field,
parseData: cleanResponse // 必须显式传入！
});
});
- 漏传
parseData是 reload 清洗失效的最常见原因 - 不要在
reload里改data字段来绕过接口 —— 那会丢掉分页参数，导致第 2 页数据被当成第 1 页渲染 - 如果清洗逻辑含异步（如查字典表补名称），必须改用
data模式 + 手动渲染，放弃url模式，否则无法控制时机
真正容易被忽略的点：清洗后的 count 必须准确。如果后端返回总数是 100，但你清洗时 filter 掉了 20 条非法数据，count 还填 100，分页器就会多出空页。要么让后端返回清洗后总数，要么清洗时同步统计有效条数 —— 这个数决定了 Layui 是否显示下一页按钮。
