/*
Hello everyone, I am working for the first time with electron. I have used JavaScript before. Can someone please show me what I am doing wrong trying to get the button onclick event to call a simple function with a console.log operation in it. Any help would be appreciated because I am not sure where all the pieces go together.
Here’s my code:
*/
// main.js
const { app, BrowserWindow, ipcMain } = require("electron");
let win = null;
const createWindow = () => {
win = new BrowserWindow({
width: 800,
height: 600,
resizable: false,
webPreferences: {
nodeIntegration: true
}
});
win.loadFile("index.html");
};
app.whenReady().then(createWindow);
ipcMain.on("callMyFunction", (event, data) => {
// Prints inside the label called funcCallTxt
funcCallTxt.innerHTML = "This event: " + event + " and This data: " + data;
// Writes to the console just to see what in the variables
console.log("This event: " + event + " and This data: " + data)
});
// renderer.js
const { contextBridge, ipcRenderer } = require("electron");
contextBridge.exposeInMainWorld("electron", {
send: (channel, payload) => ipcRenderer.send(channel, payload),
});
// index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script defer src="renderer.js"></script>
<title>Call a Function</title>
</head>
<body>
<h1>A Function Call</h1>
<label for="funcCallTxt"></label>
<button type="button" onclick="callMyFunction()">Call My Function</button>
</body>
</html>