Layui表格分页显示“无数据”提示怎么修改-Layui教程-PHP中文网

layui table 空数据默认显示“暂无数据”，需确保后端返回 data 为数组且 count 为数字并语义一致；可通过 text.none 自定义文案，或在 done 回调中根据 res.code 和 count 动态处理并清理 table.cache。

layui table 渲染空数据时显示“无数据”的默认行为

这是 layui.table 的内置逻辑：当 data 为空数组（[]）或 count 为 0，且未配置自定义提示时，自动显示“暂无数据”。它不区分“请求失败”“加载中”“真没数据”，只要最终渲染的数据源为空，就走这个分支。

用 `text` 配置项覆盖默认提示文字

最直接的办法是在 table.render() 的参数里加 text 字段，指定空状态文案：

table.render({
  elem: '#demo',
  url: '/api/list',
  cols: [[{field:'id', title:'ID'}]],
  text: {
    none: '还没有添加任何记录'
  }
});

text.none 是唯一影响“无数据”提示的字段，其他如 error、loading 不会干扰它
值必须是字符串，不能是函数或 HTML 片段（Layui 2.8.x 仍不支持 DOM 节点）
如果接口返回了 data: [] 但 count: 100，表格仍会分页并显示空行——此时 none 不触发，得检查后端是否漏传 count

后端返回空数据但前端仍显示分页栏？检查 `count` 和 `data` 结构

Layui 分页依赖两个关键字段：count（总条数）和 data（当前页数据）。常见错位场景：

深蓝色网站后台管理系统layui框架模板-AdminPro

一款深蓝色网站后台管理系统layui框架模板

下载

后端返回 {count: 0, data: []} → 正确触发 text.none
后端返回 {count: 0, data: null} 或 {count: 0}（缺 data）→ Layui 报错 Cannot read property 'length' of null，页面白屏
后端返回 {count: 5, data: []} → 表格渲染 5 个空行，分页控件照常显示，“无数据”提示完全不出现

务必保证后端响应结构符合 Layui 文档要求：data 必须是数组，count 必须是数字，且语义一致。

想动态控制提示内容？别改源码，用 `done` 回调 + `table.cache`

如果需要根据业务状态显示不同文案（比如“网络异常”“权限不足”），不能只靠 text.none，得结合请求结果判断：

table.render({
  elem: '#demo',
  url: '/api/list',
  cols: [[{field:'id', title:'ID'}]],
  done: function(res, curr, count) {
    if (res.code !== 0) {
      // 假设后端用 code=0 标识成功
      $('.layui-table-view .layui-table-body tbody').html(
        '<tr><td colspan="100%" style="text-align:center;padding:20px;color:#999;">' +
        (res.msg || '加载失败，请重试') +
        '</td></tr>'
      );
      return;
    }
    if (count === 0) {
      // 真正的空数据，可复用 text.none，也可在此处手动更新
      table.cache['demo'] = []; // 清空缓存避免旧数据残留
    }
  }
});