Question

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

我试图使用ipc将消息从渲染器进程发送到主进程。我尝试使用上面定义的功能为输入添加模糊和单击事件侦听器，但似乎未正确应用它们。

渲染器进程：

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加载到您的项目中，并使用其默认的ready函数来确保DOM存在，然后再尝试附加侦听器或自己编写一些内容。请参阅：How to wait until an element exists?以获得进一步的说明。

Answer 2

我相信我在这里找到了答案：Input addEventListener on change not firing。问题是我正在将require.config({ baseUrl: 'lib', paths: { main: 'main', jquery: 'jquery/dist/jquery', 'jquery-slim': 'jquery/dist/jquery-3.3.1.slim.min', 'jqueryUnobtrusive': 'jquery-validation-unobtrusive/jquery.validate.unobtrusive', 'bootstrap': 'bootstrap/dist/js/bootstrap', 'knockout': 'knockout/knockout-latest', 'ajax': 'jquery-ajax/jquery.unobtrusive-ajax', 'shop': '/scripts/shop/shop', 'domready': 'requirejs/domready', 'shoporder': '/scripts/shoporder/shoporder', 'popper': 'popper.js/dist/umd/popper' }}); define("popper.js", ['popper'], () => { require(['popper'], () => { require(['bootstrap']); }); define(['main', 'jquery', 'jquery-slim'], () => { require(['jqueryUnobtrusive', 'ajax']); require(['knockout']); require(['jquery']); require(['popper.js']); });函数的结果传递给pd.merge(df1, df2, on=['wellname'], how='left')函数。

如链接中所述，我将在有空的时候尝试使用addEventListener或函数语句/箭头函数。

无法在电子的渲染器过程中使用事件侦听器

2 个答案: