layer.load 的 shade 参数必须传数组［透明度,颜色］才生效，如［0.1,'#fff'］；传布尔值或数字无效，且需确保 layui 版本支持并正确调用。

layer.load 的 shade 参数怎么写才生效

直接传 shade 数组，不是布尔值或数字——这是最常踩的坑。很多人写成 shade: 0.2 或 shade: true，结果背景还是默认黑灰半透，根本改不动颜色。

layer.load() 的 shade 只接受数组格式：[透明度, 颜色]，两个元素缺一不可。透明度是 0–1 的小数，颜色支持十六进制、rgb、英文色名等 CSS 合法值。

• shade: [0.1, '#fff'] → 浅白底，几乎看不见但能阻断点击
• shade: [0.4, '#f0f9ff'] → 淡蓝遮罩，适合轻量后台操作场景
• shade: [0.01, 'transparent'] → 视觉上“没遮罩”，但依然禁用底层交互（注意：不是真正穿透）

为什么设了 shade 还是黑色？检查 layer 版本和调用位置

老版本 Layui（layer.load() 的 shade 支持不完整，部分参数会被忽略；新项目建议用 layui-v2.9.1+ 或确认文档中「加载层」章节明确写了 shade 数组支持。

另一个高频问题：在 layer.open() 里误用了 layer.load() 的配置。记住：layer.load() 是独立函数，它不走 open 的通用参数逻辑，必须把 shade 明确塞进第二个参数对象里。

• ✅ 正确：layer.load(1, { shade: [0.2, '#eef7ff'] })
• ❌ 错误：layer.load(1, { shade: 0.2 })（颜色缺失）
• ❌ 错误：layer.open({ type: 3, shade: [0.2, '#fff'] })（type: 3 不走这个配置，得用 layer.load()）

白色/浅色遮罩下图标看不清？得手动调 loading 图标样式

默认的 loading 动画（layui-layer-loading1）是深色 SVG，套在白色或浅色遮罩上会发虚甚至消失。这不是 bug，是设计如此——它默认适配深色背景。

必须用 success 回调钩住 DOM，重置图标的颜色、大小或背景：

layer.load(1, {
  shade: [0.15, '#ffffff'],
  success: function(layero) {
    layero.find('.layui-layer-loading1').css({
      'filter': 'invert(1) brightness(2)',
      'width': '48px',
      'height': '48px'
    });
  }
});

更稳妥的做法是换用自定义 SVG 或加一层带描边的 wrapper，避免纯靠 filter 在某些浏览器失效。

遮罩颜色和透明度影响交互行为吗？

不影响——shade 的视觉表现和交互控制是解耦的。无论你设成 [0.01, '#000'] 还是 [0.9, '#ff0000']，只要数组存在，底层页面就无法点击、聚焦、滚动。想“看起来有遮罩但实际可操作”？那不能靠调 shade，得设 shade: false + 手动加一层半透 <div> 覆盖，并自己处理 <code>pointer-events。

另外提醒一句：shadeClose 对 layer.load() 无效，它只作用于 layer.open() 类型的弹层。loading 层要关闭，只能靠 layer.close(index) 或 layer.closeAll('loading')。