layer.load未显示动画主因是未保存返回索引或被立即关闭；须保存index并确保在Ajax完成后再调用layer.close(index)，且避免同步阻塞、DOM未就绪或组件卸载导致的异常。
layer.load 为什么没显示动画？
多数情况是没正确调用或被后续操作立即关闭了。layer.load() 默认返回一个索引值，但如果你没保存它，或者紧接着执行了 layer.close() 或页面跳转、dom 替换等操作，动画根本来不及渲染就消失了。
常见错误现象：layer.load() 调用后页面毫无反应；控制台无报错，但 loading 图标一闪而过；在 Ajax 请求里直接写 layer.load(); $.ajax(...) 却没把 index 传给 success/error 中的 layer.close(index)。
- 必须保存
layer.load()的返回值，比如let index = layer.load(1); - 加载类型参数只能是
0（小菊花）、1（默认圆圈）、2（文字提示），超出范围不显示 - 不要在同步代码后立刻
layer.close()—— 它不是异步等待，只是开个层，关不关全靠你手动控制
如何配合 Ajax 正确使用 layer.load
核心原则：开层 → 发请求 → 成功/失败后关层。漏掉任一环节都会导致 loading 状态异常。
典型场景是表单提交或数据拉取，比如点击按钮后展示 loading，等接口返回再关闭：
let index = layer.load(1, {shade: false}); // 可选配置：去掉遮罩更轻量
$.ajax({
url: '/api/data',
type: 'GET',
success: function(res) {
layer.close(index); // 必须传入原始 index
console.log(res);
},
error: function() {
layer.close(index);
layer.msg('请求失败');
}
});
-
shade: false能避免背景变灰，适合局部加载；保留默认shade: 0.3更强调阻断操作 - 如果用
async: false（已废弃），会导致 UI 冻结，layer.load动画也无法渲染 —— 必须用回调或 Promise - Vue/React 项目中若组件卸载早于请求完成，需在
beforeUnmount或useEffect cleanup里加layer.close(index)防止内存泄漏
layer.load 支持哪些自定义参数？
除了第一个数字类型参数，第二个对象参数可微调行为，但选项有限 —— 官方文档没写的别硬试，比如 time、offset 对 load 无效。
-
shade：遮罩透明度，false或0表示不遮罩 -
shadeClose：设为true允许点击遮罩关闭（一般不用，loading 状态不该让用户干预） -
time：对layer.load无效，这是layer.msg的参数 - 不能用
area、offset控制位置 ——layer.load固定居中，且尺寸不可调
想改图标或文字？不行。Layui 的 loading 是内置 SVG，只支持三种样式，强行 DOM 操作会破坏 layer 的生命周期管理。
为什么 Vue 项目里 layer.load 不生效？
不是框架兼容问题，而是执行时机不对。常见于在 mounted 里直接调用 layer.load()，但此时 DOM 还没挂载完，layer 依赖的 document.body 可能为空或未就绪。
- 确保 Layui 已完整加载，检查
window.layer是否存在，否则会报layer is not defined - 在
nextTick里调用：this.$nextTick(() => { layer.load(1); }) - SSR 场景下服务端渲染时
window不存在，必须加if (typeof window !== 'undefined')判断 - Webpack 打包时若用了 Tree Shaking，可能删掉了
layer模块 —— 确保layui.all.js或按需引入了layer
真正麻烦的不是怎么写，而是关层时机和上下文生命周期的匹配 —— 多一层异步、多一个条件分支，就多一个忘记 layer.close() 的可能。
