Android 4.4及更早WebView因不支持passive: true导致addEventListener报错白屏，可通过特性检测封装、Babel降级或WebView脚本兜底兼容，构建时需约束目标环境并实测验证。
这个问题本质是 JavaScript 事件监听器中用了 passive: true，而 Android 4.4（KitKat）及更早版本的 WebView 内核（基于旧版 Chromium）不识别该参数，解析失败后直接中断脚本执行，导致页面渲染卡住、DOM 不挂载、最终呈现白屏。
确认是否为 passive 兼容性问题
在真机或模拟器上打开开发者工具（Chrome Remote Debug），连接 WebView 后检查 Console 是否报错：
Uncaught TypeError: Failed to execute 'addEventListener' on 'EventTarget': parameter 3 is not of type 'AddEventListenerOptions' or 'boolean'- 或类似提示 “passive” 无法识别的语法错误
- 同时观察 Network 面板：HTML 已加载完成，但 JS 文件加载后无后续执行痕迹（如 Vue/React 初始化未触发）
前端侧兼容处理（推荐首选）
不要移除 passive（它对滚动性能至关重要），而是用特性检测 + 安全封装替代硬编码：
- 用
try/catch包裹带 passive 的监听器注册逻辑 - 或使用标准化的 polyfill 方案，例如：
const opts = typeof AddEventListenerOptions !== 'undefined'<br> ? { passive: true }<br> : false;
再传入el.addEventListener('touchstart', handler, opts) - 构建时通过 Babel 插件（如
@babel/plugin-transform-event-legacy）自动降级，避免手动改业务代码
客户端强制兜底（适用无法改前端时）
在 WebView 初始化阶段注入一段兼容脚本，覆盖原生 addEventListener 行为：
- 在
WebSettings.setJavaScriptEnabled(true)后，调用：webView.evaluateJavascript("if (typeof EventTarget !== 'undefined') { const ori = EventTarget.prototype.addEventListener; EventTarget.prototype.addEventListener = function(type, listener, options) { try { ori.call(this, type, listener, options); } catch (e) { ori.call(this, type, listener, options && typeof options === 'object' ? options.capture : options); } }; }", null); - 注意：仅限 Android 4.4–5.1 等明确存在该问题的版本注入，避免干扰新版行为
- 该方案治标不治本，建议仅作为临时过渡
构建与发布环节预防
Vue/React 项目打包时默认可能启用现代语法优化，需主动约束目标环境：
- Vue CLI：在
vue.config.js中配置transpileDependencies: ['core-js', 'regenerator-runtime']，并确保browserslist包含Android >= 4.4 - Webpack：启用
target: ['web', 'es5']，配合@babel/preset-env的useBuiltIns: 'usage' - 上线前用低版本设备实测关键交互页（如首页、登录页），重点验证 touch 事件是否触发、页面是否完整挂载
