Layui表格怎么实现在分页栏显示当前请求的接口耗时-Layui教程-PHP中文网

可在done回调中通过url设为函数并用performance.now()手动埋点获取接口耗时，绑定到表格实例而非全局变量，并在rendered事件或settimeout后安全注入分页栏，避免dom错位与并发冲突。

layui table 的 `done` 回调里拿不到接口耗时？

因为 done 只传 res 和 curr、count，不带时间信息。layui 默认不记录请求耗时，得自己埋点——不是改源码，也不是等官方支持，而是用原生 xmlhttprequest 或 fetch 封装一层再喂给 table.render()。

怎么在 `url` 配置为字符串时手动注入耗时？

不行。只要写成 url: '/api/list'，Layui 就走内部 $.ajax，你插不进钩子。必须切换成 url 为函数的形式，自己控制请求发起和响应处理：

url 设为函数，返回一个 Promise（或直接 resolve 数据）
在函数内用 performance.now() 记开始/结束时间
把耗时算出来，存到全局变量或闭包里，供 done 读取
注意：Layui 2.8+ 支持 Promise，旧版需用 layui.jquery 的 $.ajax + done 手动 resolve

table.render({
  elem: '#demo',
  url: function (obj) {
    const start = performance.now();
    return $.ajax({
      url: '/api/list',
      data: { page: obj.page, limit: obj.limit },
      dataType: 'json'
    }).then(res => {
      const cost = Math.round(performance.now() - start);
      window.lastApiCost = cost; // 简单挂 window，也可用闭包
      return res;
    });
  },
  done: function (res, curr, count) {
    // 更新分页栏右侧文字
    const $info = $('.layui-table-page .layui-laypage-curr + .layui-laypage-skip');
    if ($info.length) {
      $info.before(`<span style="margin-right:10px;color:#999;">耗时：<code>${window.lastApiCost}</code>ms</span>`);
    }
  }
});

分页栏 DOM 不稳定，插入耗时文字容易错位？

Layui 分页结构会随版本微调，硬查 .layui-laypage-curr + .layui-laypage-skip 容易失效。更稳的做法是：在 done 里用 setTimeout 延迟一小会，等 Layui 渲染完再操作；或者监听 table.on('rendered')（Layui 2.8+）：