完全加载后显示窗口
当我创build基本的应用程序，并使用electron命令初始化它，它显示我一个空白的窗口，稍后加载内容。
内容完全加载后应使用哪个事件和哪个对象来显示窗口？
在window.webContent对象上did-finish-load ？ 或者也许dom-ready ？ 或者也许别的东西？
app.js ：
var app = require('app'), Window = require('browser-window'), mainWindow = null; require('crash-reporter').start(); app.on('ready', function() { mainWindow = new Window({ width: 600, height: 400, show: false }); mainWindow.loadUrl('file://' + __dirname + '/index.html'); mainWindow.show(); // // mainWindow.webContent.on('did-finish-load', function() { // something like that is a proper way? // }); // });
好的，我自己find了答案。 正确的事件是did-finish-load ，应该像这样使用：
var Window = new BrowserWindow({ width: 600, height: 400, show: false }); Window.loadUrl('file://somefile.html'); Window.webContents.on('did-finish-load', function() { Window.show(); });
对于find这个答案的人 – 在这里你可以检查关于这个主题的官方电子文档：
在加载页面时，如果窗口尚未显示，则渲染器进程首次渲染页面时，将显示准备显示的事件。 在此事件之后显示窗口将没有可视闪光灯：
let win = new BrowserWindow({show: false}) win.once('ready-to-show', () => { win.show() })
这种方式是有效的，但是最好的做法是使用API文档中陈述的ready-to-show ：
在加载页面时，如果窗口尚未显示，则渲染器进程首次渲染页面时，将显示准备显示的事件。 在此事件之后显示窗口将没有可视闪光灯：
并请注意：
这个事件通常在did-finish-load事件之后发出，但是对于具有许多远程资源的页面，它可能在did-finish-load事件之前发出。
最后，您应该更新背景颜色，以便与您窗口的内容背景相近。 这里是一个例子：
const {BrowserWindow} = require('electron') let win = new BrowserWindow({show: false, backgroundColor: '#420024'}) win.once('ready-to-show', () => { win.show() })
你也可以添加快速的CSS淡入淡出内容。 只要添加这也是您的CSS并将.ui.container设置为您的根DOM元素的任何类。 请注意，如果将其设置为<body/> ，则不起作用
@keyframes fadein { from { opacity: 0; } to { opacity: 1; } } .ui.container { animation: fadein 0.420s; }
请参阅以下链接了解更多信息： https : //electron.atom.io/docs/all/#using-ready-to-show-event https://www.christianengvall.se/electron-white-screen-app-startup /
您可以尝试将内容加载到不可见的iframe中，然后创build窗口并将内容从iframe传输到窗口。