loading动画不显示是因为未发起真实网络请求;必须配置有效url且后端返回200,若用data本地数据、url为空或错误、parsedata/response配置不匹配,均导致loading不触发。

必须配 url 且确保请求真实发出,loading: true 才会生效;只设 loading: true 但没走网络请求,动画压根不会出现。
为什么搜索时 loading 动画不显示?
常见错误现象:table.render() 或 table.reload() 里写了 loading: true,但搜索一触发,页面毫无加载迹象。
- 最常被忽略的前提:表格必须配置了有效的
url,且后端接口能正常响应(Network 面板能看到请求发出并返回 200) - 如果用了
data配置本地数据、或url是空字符串 / 未定义 / 拼错路径,Layui 就当“无异步请求”,直接跳过 loading 流程 -
parseData或response字段配置错误(比如后端返回code: 0,你却写了statusCode: 1),会导致请求被判定为失败,done不执行,loading 也就卡住不消失——看起来像“没启动”,其实是启动了但没关
搜索触发 reload 时如何正确开启 loading
关键点:每次调用 table.reload() 都要确保参数里包含合法 url,且其他请求参数(如 where)不破坏原始配置结构。
- 不要在
reload里删掉url—— 即使是搜索,也要保持url存在,否则退化为本地渲染 - 推荐写法:
table.reload('id', { where: { keyword: $('#keyword').val() } }),前提是初始化时render()已设url - 若搜索逻辑需动态换
url,务必确认新地址可访问,且返回格式仍匹配response配置(如data字段名一致) - 检查 Network → XHR,搜索操作是否真发出了请求;没发请求,
loading就是摆设
自定义 loading 文案或图标(v2.9.10+)
想让“加载中”文字随搜索动态变化(比如加省略号),不能靠 loading: true —— 它只支持静态内容。得手动接管。
- 关闭默认 loading:
loading: false - 在搜索按钮点击时,用
layer.load(1)手动开层,并保存索引 - 在
table.reload()的done或error回调里调layer.close(index) - 注意:如果搜索用的是表单 submit 触发,别忘了阻止默认提交,否则页面刷新导致 loading 残留
最容易被忽略的是:搜索动作是否真的触发了一次新的异步请求。很多“假搜索”只是前端 filter,根本没发 HTTP 请求,这时候无论怎么配 loading 都无效——得先确认它是真搜索还是假过滤。











