如何在 Electron 中隐藏（而不是销毁）BrowserView

Question

我在Electron 5.0.3 中工作，我想隐藏一个BrowserView，这样就不需要重新创建 BrowserView。我对如何实现这一点没有任何偏好。任何解决方案（JS、CSS 等）都足够了。

我已经浏览了BrowserView 文档，我发现这里没有任何可以帮助的内容，并且将 BrowserView 移到屏幕外的某个地方并不完全理想。

Answer 1

我知道这已经过时了，但我遇到了这个解决方案的问题并且有替代方案。

BrowserView在某些情况下，从 中删除BrowserWindow可能会产生一些意想不到的后果。我发现，如果您使用 a来托管外部内容，而删除和设置似乎保留了内容，您可能会失去通过代码（例如 via ）或在某些情况下调用异步事件的 UI 控件与其BrowserView交互的能力view.webContents.executeJavaScript()有时完全停止工作。

如果您只想隐藏BrowserView，则将边界设置为 0 效果非常好：

  view.setBounds({ x: 0, y: 0, width: 0, height: 0 })

然后使用主机BrowserWindow尺寸恢复它：

  let wb = win.getBounds()
  view.setBounds({ x: 0, y: 0, width: wb.width, height: wb.height })

旁注：setBrowserView()和之间有区别addBrowserView()。前者将从BrowserViews中删除所有其他内容BrowserWindow（这意味着如果您还设置了视图，则无需显式删除视图，并且如果您使用添加，则需要管理您的视图。）

Answer 2

第一个解决方案（最佳）：

browserWindow.addBrowserView(browserView)
browserWindow.removeBrowserView(browserView)

addBrowserView()和 removeBrowserView()。移除浏览器视图和隐藏一样，不会让 browserView 重新渲染。

次要解决方案（不是最优的）：

// not optimal if you call more than once because it will constantly add more CSS
browserView.webContents.insertCSS('html{display: block}')
browserView.webContents.insertCSS('html{display: none}')

插入CSS()