后台列表页点查询，弹一个转圈遮罩，接口回来后遮罩不消失，整页点不动，只能刷新。查代码，layer.load 的返回值存进了全局变量，两次请求并发，后一次把前一次的 index 覆盖，close 的时候关掉的是新弹窗，旧的那个一直挂在上面。

先把 index 存对地方

layer.load 返回一个数字，关闭必须用这个数字。写法上别用全局变量，在函数内部用局部变量接住最稳：

var idx = layer.load(1, { shade: 0.3 });

请求回来在 success 和 error 里都调 layer.close(idx)，只写 success 是常见漏洞，接口 500 时就永远转圈。用 finally 或 complete 回调更保险。

三种样式对应三个场景

  • type 0 是默认的白色圆点旋转，配浅色背景好看。
  • type 1 是横向流动的线条，适合表格、列表这类整块区域。
  • type 2 是一圈加载提示，带文字说明，用在需要告知用户正在做什么的场合。

shade 控制遮罩透明度，0 表示不加遮罩，0.3 是常用值。加了遮罩后底层点不动，这正是它的作用，不要在加载时还让用户重复点按钮。

表格自带的 loading 别重复加

layui 的 table 模块渲染时本身有 loading 状态，reload 期间会自动显示。外面再套一层 layer.load，会出现两层遮罩，关掉一层还有一层，看起来就像关不掉。用 table 的 done 回调确认渲染结束，外面那层可以省掉。

表单提交按钮也要处理，点击后置灰并加 loading，回调里恢复。只靠遮罩不管按钮，用户刷新页面会重复提交，订单类接口容易出脏数据。

遮罩挡住弹窗的情况

在 layer.open 里再调 layer.load，层级可能低于弹窗，转圈被压在下面看不见。给 load 传 zIndex 或者打开弹窗时统一层级管理，别让两个组件各自为政。layui 2.8 之后层级分配更规范，升级版本也能缓解一部分问题。

原则很简单：一次请求一个 index，成对出现，异常分支也要关。