js关闭浏览器窗口_电子JS | 浏览器窗口

js关闭浏览器窗口

Just like any other desktop software application, Electron JS also makes use of "Desktop Windows" as its user interface.

与其他桌面软件应用程序一样， Electron JS也使用“桌面Windows”作为其用户界面。

We must understand that Electron JS uses web pages as its graphical user interface. BrowserWindow enables us to see the user interface.

我们必须了解， Electron JS使用网页作为其图形用户界面。 BrowserWindow使我们能够查看用户界面。

Let us ride on to our first code and build a browser window.

让我们继续学习第一个代码并构建一个浏览器窗口 。

Note: Ensure you have Node.Js and Electron JS installed.

注意：确保已安装Node.Js和Electron JS。

Create a new JavaScript file App.js

创建一个新JavaScript文件App.js

const electron = require ('electron')

const app = electron.app // import electron module
const BrowserWindow = electron.BrowserWindow //enables UI
let mainWindow
app.on ('ready', _ => {
    mainWindow = new BrowserWindow({
        height : 400,
        width : 400
    })

    mainWindow.loadFile('src/index.html')

    mainWindow.on ('closed', _ => { //detect if window is closed.
        console.log ('closed!')
        mainWindow = null
    })
})

• Firstly, we import electron whenever we are starting an electron application.

  首先，无论何时开始应用电子，我们都要导入电子 。

• We equally import all necessary modules or APIs needed it our application.

  我们同样导入应用程序需要的所有必要模块或API。

• We also notice that it's imported using the Common JS format or syntax.

  我们还注意到，它是使用Common JS格式或语法导入的。

• let mainWindow keeps a global reference of the window object where windows may automatically close when the JavaScript object is garbage collected.

  let mainWindow保留窗口对象的全局引用，当垃圾对象被垃圾回收时，窗口可能会自动关闭。

• app.on creates a new window when the app is initialized and is ready to create a browser window. The width and height values determine the size of the window.

  当应用初始化后， app.on会创建一个新窗口，并准备创建浏览器窗口。 宽度和高度值确定窗口的大小。

• loadFile method reads and displays the HTML / CSS / JavaScript file to be used as a user interface.

  loadFile方法读取并显示要用作用户界面HTML / CSS / JavaScript文件。

• LoadURL method can also be used as an alternative to loadFile.

  LoadURL方法也可以用作loadFile的替代方法。

• Notice that ready and closed options are used to detect if the app is ready or closed.

  请注意， 就绪和关闭选项用于检测应用程序是就绪还是关闭。

Place your HTML, CSS, and JavaScript files in the src folder.

将您HTML，CSS和JavaScript文件放在src文件夹中 。

Finally, start your app and see the output.

最后，启动您的应用程序并查看输出。

You can always check out the Electron JS official documentation on their website.

您可以随时在其网站上查看Electron JS的官方文档。

Drop your comments if in need of help.

如果需要帮助，请删除您的评论。

翻译自: https://www.includehelp.com/electron-js/browserwindow.aspx

js关闭浏览器窗口