ElectronJS事件监听器异常：选新Excel仍发送旧收件人邮件

可能的核心原因及对应解决方法 #

1. 收件人存储变量未重置 #

• 问题：如果存储收件人的数组是全局作用域（比如模块顶部、渲染进程window全局变量），每次读取新Excel时只追加数据而未清空，导致新旧收件人叠加。
• 解决：
  • 把收件人数组定义在文件选择的事件回调内部，每次选新文件都重新初始化：

    // renderer.js 示例
    document.getElementById('fileInput').addEventListener('change', async (e) => {
      // 每次选文件都重置数组
      const recipients = [];
      // 读取Excel并填充recipients...
      await window.electronAPI.sendMails(recipients);
    });
    

  • 如果必须用全局变量，在读取新Excel前强制清空：

    // main.js 示例
    let globalRecipients = [];
    
    ipcMain.handle('read-excel', async (event, filePath) => {
      // 清空旧数据
      globalRecipients = [];
      // 读取Excel并push新数据到globalRecipients...
    });
    

2. 邮件发送任务未终止或队列未清空 #

• 问题：如果第一次发送任务未完全结束，或者发送队列没有重置，选新文件时会把新任务和旧任务一起执行。
• 解决：
  • 添加发送状态开关，新任务开始前终止旧任务：

    // main.js 示例
    let isSending = false;
    let abortController = null;
    
    ipcMain.handle('send-mails', async (event, recipients) => {
      if (isSending) {
        // 终止当前发送任务（如果用了支持终止的请求，比如fetch的AbortController）
        abortController?.abort();
        isSending = false;
      }
      isSending = true;
      abortController = new AbortController();
      try {
        for (const recipient of recipients) {
          await sendSingleMail(recipient, abortController.signal);
        }
      } catch (err) {
        if (err.name !== 'AbortError') throw err;
      } finally {
        isSending = false;
        abortController = null;
      }
    });
    

3. 事件监听器重复绑定 #

• 问题：如果多次调用addEventListener绑定同一个事件（比如每次页面渲染、按钮点击都绑定一次），会导致触发一次事件执行多次发送逻辑。
• 解决：
  • 确保监听器只绑定一次，比如放在页面初始化的DOMContentLoaded回调里：

    // renderer.js 示例
    document.addEventListener('DOMContentLoaded', () => {
      // 只绑定一次文件选择事件
      document.getElementById('fileInput').addEventListener('change', handleFileSelect);
      // 只绑定一次发送按钮事件
      document.getElementById('sendBtn').addEventListener('click', handleSend);
    });
    
    async function handleFileSelect(e) { /* 读取Excel逻辑 */ }
    async function handleSend() { /* 发送邮件逻辑 */ }
    

  • 如果需要动态更换回调，保存回调引用以便移除：

    let currentSendHandler = handleSend;
    // 移除旧监听
    sendBtn.removeEventListener('click', currentSendHandler);
    // 定义新回调
    currentSendHandler = async () => { /* 新发送逻辑 */ };
    // 绑定新监听
    sendBtn.addEventListener('click', currentSendHandler);
    

调试建议 #

• 在读取Excel后、发送前，打印当前收件人列表的长度和内容，确认是否包含旧数据：

  console.log('当前收件人数量:', recipients.length);
  console.log('当前收件人:', recipients);
  

• 主进程的日志可以通过终端查看，渲染进程按F12打开开发者工具查看控制台输出，跟踪变量变化和函数调用次数。

内容的提问来源于stack exchange，提问作者MKD