17681880207 · 2024 年 8 月 1 日 · 3889 次点击

涉及技术栈

electron-vite / vue3

问题描述

前端项目 A 通过 iframe 加载项目 B ，但是前端项目 B 要允许内嵌在 electron 中，所以在 title 组件上配置了 -webkit-app-region: drag; 属性，允许用户直接通过标题栏进行窗口拖拽。然后就发现 A 项目中的 iframe 无法加载 B 项目，经过反复测试，发现把 -webkit-app-region: drag; 属性注释就可以正常的加载。
无法加载的表现形式为，灰色，如图：

目前我的解决方案

目前我的解决方案 B 项目中的拖拽使用通过 ipcRenderer.send 方法来实现，不再使用 -webkit-app-region: drag; 属性。

问题

想知道 -webkit-app-region: drag; 为什么会导致 iframe 加载页面失败的原因，以及有无其他更好的解决方案？