本文详解如何在Electron中正确使用ipcMain.on和ipcRenderer.on实现跨进程通信，重点解决因参数签名错误导致的弃用警告，并给出符合最新API规范的完整示例。
本文详解如何在electron中正确使用`ipcmain.on`和`ipcrenderer.on`实现跨进程通信，重点解决因参数签名错误导致的弃用警告，并给出符合最新api规范的完整示例。
在 Electron 应用中，主进程与渲染进程之间的安全通信依赖于 IPC（Inter-Process Communication）机制。但自 Electron 12+ 起，ipcRenderer.on() 的回调函数签名已明确要求必须声明 event 参数作为第一个形参，否则不仅会触发类型警告（如 TypeScript 报错），在严格模式或新版运行时中还可能引发逻辑异常——这正是你遇到 "event is deprecated" 提示的根本原因。
✅ 正确的 IPC 监听器写法
ipcRenderer.on() 的标准签名如下：
ipcRenderer.on('channel', (event, ...args) => { /* handler */ });其中：
-
event是IpcRendererEvent实例，包含sender、reply()、preventDefault()等方法，用于响应式通信； -
...args是主进程通过webContents.send('channel', ...data)发送的任意数量参数（按顺序解构）。
因此，你原 create.js 中的监听器需修正为：
const { ipcRenderer } = require('electron');
document.getElementById('createButton').addEventListener('click', () => {
ipcRenderer.send('createNote');
});
// ✅ 修正：显式接收 event 参数，并解构后续数据
ipcRenderer.on('noteCreated', (event, noteText) => {
const noteContainer = document.getElementById('noteContainer');
const noteCard = document.createElement('div');
noteCard.className = 'note-card'; // 建议添加 CSS 类便于样式控制
noteCard.textContent = noteText;
noteContainer.appendChild(noteCard);
});同时，主进程 main.js 可保持不变（当前写法已正确），但建议增强健壮性，例如检查 mainWindow 是否存在：
ipcMain.on('createNote', () => {
if (mainWindow) {
const noteText = 'New Note';
mainWindow.webContents.send('noteCreated', noteText);
}
});⚠️ 注意事项与最佳实践
-
不要忽略
event参数：即使不使用它，也必须声明（可命名为_event或e），否则违反 API 规范； -
避免内存泄漏：在页面卸载前移除监听器（尤其在单页应用中）。推荐在
beforeunload或组件销毁时调用：// create.js 末尾添加 window.addEventListener('beforeunload', () => { ipcRenderer.removeAllListeners('noteCreated'); }); -
参数类型安全：若使用 TypeScript，可定义更精确的类型：
ipcRenderer.on('noteCreated', (event: IpcRendererEvent, noteText: string) => { ... }); -
调试技巧：在监听器中打印
event查看其结构，有助于理解可用方法（如event.senderId、event.frameId）。
遵循以上规范，你的“新建便签”功能即可稳定运行，且代码具备良好的可维护性与未来兼容性。
