electron 导入两个js，上面的文件似乎没有执行，下面的一个却执行成功，为什么？

iezvtpos 于 9个月前发布在 Electron

关注(0)|答案(1)|浏览(128)

看，两个脚本标签，上面的js没用，下面的js有用，交换位置也是，上面的没用。没有错误报告。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>index</title>
</head>
<body>
    <h1>hello</h1>
    <button id="yellowWin">create new window</button>
</body>

<script src="../../src/main/rightClick.js"></script>
<script src="../../src/render/yellowWin.js"></script>

</html>

我听不懂，请帮助我，谢谢。
rightClick.js是右键单击菜单，yellowWin.js是单击按钮创建一个新窗口，它们都调用了@electron/remote模块。
rightClick.js:

const {Menu} = require('@electron/remote')
const currentWindow = require('@electron/remote').getCurrentWindow();
const template = [
    {
        label: 'Copy',
        accelerator: 'ctrl+c',
        click: () => {
            console.log('复制');
        }
    },
    {
        label: 'Cut',
        accelerator: 'ctrl+x',
        click: () => {
            console.log('剪切');
        }
    },
    {
        label: 'Paste',
        accelerator: 'ctrl+v',
        click: () => {
            console.log('粘贴');
        }
    }
];
const menu = Menu.buildFromTemplate(template);
window.onload = () => {
    window.addEventListener('contextmenu', (e) => {
        e.preventDefault();
        menu.popup({window: currentWindow});
        console.log('右键');
    }, false)
}

yellowWin.js：

const {BrowserWindow} = require('@electron/remote')

const yellowWin = document.getElementById('yellowWin');

window.onload = ()=> {
    yellowWin.onclick =  ()=> {
        let newWin = new BrowserWindow({
            width: 400,
            height: 200
        })
        newWin.loadFile('static/index/yellow.html')
        newWin.on('closed', () => {
            newWin = null
        })
        console.log('yellowWin');
    }
}

electron

来源：https://stackoverflow.com/questions/77064062/import-two-js-the-above-file-does-not-appear-to-be-executed-and-the-following

1条答案

按热度按时间

1mrurvl11#

Electron带有不同的security功能，默认情况下会激活。出于安全原因，您应该将NodeJS和Electron相关的代码保留在主进程上，而不是像这里一样尝试将其导入渲染器进程。最后，使用@electron/remote模块是不必要的，因为你已经可以用Electron的原生API做同样的事情。
现在，对于您的特定情况，您需要使用IPC和preload来在渲染器和主进程之间进行通信。如果你想创建一个新的窗口按钮点击例如：

index.html

<!-- Remove these:

<script src="../../src/main/rightClick.js"></script>
<script src="../../src/render/yellowWin.js"></script>

Add a new script: -->

<script src="./renderer.js"></script>

renderer.js

const { electronAPI } = window; // Gets the API exposed with `contextBridge`
const yellowWin = document.getElementById('yellowWin');

yellowWin.addEventListener("click", electronAPI.createWindow);

preload.js

const { contextBridge, ipcRenderer } = require('electron');

contextBridge.exposeInMainWorld('electronAPI', {
  createWindow: () => ipcRenderer.send('create-window')
});

main.js

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

app.whenReady().then(() => {
  // [...] Code to create your main window,
  // don't forget to link the preload file with `webPreferences.preload`

  ipcMain.on('create-window', () => {
    // [...] Code to create the new window
  });
});

更详细的例子可以in the docs，我建议你仔细阅读，因为你需要的所有信息都在这里。如果你很难理解IPC，我建议你看看this article，它很好地解释了一切是如何工作的。

赞(0）回复(0）举报 9个月前

我来回答

electron 导入两个js，上面的文件似乎没有执行，下面的一个却执行成功，为什么？

1条答案

相关问题

热门标签

最新问答