时间戳

首页 > 解决方案 > 如何更改 Electron 中使用的 html 文件？

javascript - 如何更改 Electron 中使用的 html 文件？

问题描述

我正在尝试更改 Electron 应用程序中使用的 html 文件。我在 StackOverFlow 上尝试了几个建议，但我无法实现任何目标。我的代码如下：

主.js：

<!DOCTYPE html>
<html>
    <head>
        <script src="renderer.js"></script>
    </head>
    <body>
        <h1>One</h1>
        <button id="change">Change</button>
    </body>
</html>

新的.html：

<!DOCTYPE html>
<html>
    <head></head>
    <body>
        <h1>Two</h1>
    </body>
</html>

主.js：

const { app, BrowserWindow } = require('electron')
const path = require('path')

function createWindow () {  // Create the browser window.  
    const mainWindow = new BrowserWindow({    width: 800,    height: 600 })
    mainWindow.loadFile('index.html')
    mainWindow.openDevTools();
}

app.whenReady().then(() => {  
    createWindow()
    app.on('activate', function () {     
        if (BrowserWindow.getAllWindows().length === 0) createWindow()  
    })
})

渲染器.js：

const {BrowserWindow} = require('electron').remote
const path = require('path')

const newWindowBtn = document.getElementById('change')

newWindowBtn.addEventListener('click', (event) => {
  let win = new BrowserWindow({ width: 400, height: 320 })

  win.on('close', () => { win = null })
  win.loadFile("new.html");
})

一旦单击 index.html 中的按钮，我正在尝试将 html 文件更改为 new.html。

标签： javascripthtmlelectron

解决方案

您可以location.href='new.html'在此功能中使用在一个窗口中更改页面。

推荐阅读