无法在电子渲染器进程中使用事件监听器

Question

我正在尝试制作一个带有输入的 Electron 应用程序，该值将用于通过 win.setProgressBar()

设置应用程序的进度条

我尝试使用 ipc 从渲染进程向主进程发送消息。我尝试使用上面定义的函数为输入添加 blur 和 click 事件侦听器，但它们似乎没有正确应用。

渲染器进程：

const {ipcRenderer} = require("electron");

function setProgress(pgrss) {
    console.log("fromage"); // For debugging purposes
    ipcRenderer.send("sendMainMessage", {
        progress: pgrss
    });
};

document.getElementById("progress").addEventListener("click", setProgress(parseFloat(document.getElementById("progress").value)));

在HTML页输入：

<div class="pane">
    <input id="progress" type="number" value="0.5">
</div>

在 HTML 页面中加载渲染器 JS：

<script>
  require("electron-photon")
  require('./renderer.js')
</script>

主进程ipc接收：

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

// ...

ipcMain.on("sendMainMessage", (event, properties) => {
  mainWindow.setProgressBar(properties.progress);
});

我只是将应用程序的进度条设置为事件发生时我通过渲染器进程和 ipc 在输入字段中输入的值。根据 devtools，看起来用于事件侦听器的渲染器进程的函数在加载时运行一次，并且事件侦听器未应用于输入字段。这是控制台中显示的内容，不取决于输入中是否输入了某些内容： https://i.imgur.com/poxXOY5.png。在输入元素的“事件侦听器”选项卡中，渲染器脚本中没有显示任何事件侦听器。

Answer 1

我认为问题是事件侦听器在 DOM 完全加载之前尝试附加，导致它附加到任何东西。您可以将 jquery 加载到您的项目中并使用其默认就绪函数来确保 DOM 在尝试附加侦听器之前存在，或者您自己编写一些东西。请参阅：How to wait until an element exists? 以获得进一步说明。

Answer 2

我相信我在这里找到了答案：。问题是我将 addEventListener 函数传递给 setProgress() 函数的结果。

如 link 中所述，我会在有时间时尝试 .bind 或函数 statement/arrow 函数。

无法在电子渲染器进程中使用事件监听器

Can't use event listeners in renderer process in electron

javascript

ipc

electron