react + electron 通过 ipcMain 获取下载目录方法

在 Electron 中，可以通过 `ipcMain` 模块来处理主进程和渲染进程之间的通信。要获取下载目录，可以在主进程中使用 `dialog` 模块弹出一个选择目录的对话框，然后将所选目录返回给渲染进程。

以下是一个示例代码：

在主进程中（`main.js`）：

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

let mainWindow;

function createWindow() {
  mainWindow = new BrowserWindow({ width: 800, height: 600 });
  mainWindow.loadFile('index.html');
  // 监听来自渲染进程的消息
  ipcMain.on('getDownloadPath', async (event) => {
    const result = await dialog.showOpenDialog(mainWindow, {
      properties: ['openDirectory'],
      defaultPath: app.getPath('downloads'),
    });
    if (!result.canceled) {
      // 如果用户选择了目录，则向渲染进程发送选择的目录路径
      event.reply('selectedDownloadPath', result.filePaths[0]);
    }
  });
}

app.whenReady().then(() => {
  createWindow();
});

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit();
  }
});

app.on('activate', () => {
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow();
  }
});

在渲染进程中（例如 `App.js` 组件）：

import React, { useState } from 'react';
import { ipcRenderer } from 'electron';

function App() {
  const [downloadPath, setDownloadPath] = useState('');

  const handleGetDownloadPath = () => {
    ipcRenderer.send('getDownloadPath');
    ipcRenderer.once('selectedDownloadPath', (event, path) => {
      setDownloadPath(path);
    });
  };

  return (
    <div>
      <button onClick={handleGetDownloadPath}>选择下载目录</button>
      <p>下载目录：{downloadPath}</p>
    </div>
  );
}

export default App;

当用户点击 "选择下载目录" 按钮时，渲染进程会向主进程发送一个 `getDownloadPath` 消息，主进程会弹出一个选择目录的对话框。如果用户选择了目录，则主进程会向渲染进程发送一个 `selectedDownloadPath` 消息，同时发送选择的目录路径作为参数。渲染进程接收到消息后，更新 UI 显示下载目录。