Electron - 打开文件夹对话框答案

【问题标题】：Electron - Open Folder DialogElectron - 打开文件夹对话框
【发布时间】：2018-02-12 02:46:12
【问题描述】：

我希望用户能够从文件夹对话框中选择一个文件夹。
到目前为止，我已经尝试关注this 教程，但没有成功。
我被困在了

exports.selectDirectory = function () {
  // dialog.showOpenDialog as before
}

我需要做什么才能检索所选文件夹的完整路径？
谢谢！

【问题讨论】：

好吧，我通过使用我在主帖中提到的文章帖子和this答案解决了这个问题。

标签： javascript dialog directory electron

【解决方案1】：

对话api在主进程中可用(https://electron.atom.io/docs/)。

要创建一个对话框，您必须通过从渲染器进程发送消息来告诉您的主进程这样做。

试试这个代码：

// in your renderer process:-

const ipcRenderer = require('electron').ipcRenderer;

ipcRenderer.send('selectDirectory');


//in you main process:-

const electron = require('electron');

const ipcMain = electron.ipcMain;

const dialog = electron.dialog;

//hold the array of directory paths selected by user

let dir;

ipcMain.on('selectDirectory', function() {

    dir = dialog.showOpenDialog(mainWindow, {

        properties: ['openDirectory']

    });

});

注意：这里是mainWindow，它是父浏览器窗口，它将容纳对话框。

【讨论】：

据我所知，渲染器中有对话框。
我做到了。使用遥控器。

【解决方案2】：

你需要使用电子遥控器

const {dialog} = require('electron'),
WIN = new BrowserWindow({width: 800, height: 600})

/*
//renderer.js - a renderer process
const {remote} = require('electron'),
dialog = remote.dialog,
WIN = remote.getCurrentWindow();
*/

let options = {
 // See place holder 1 in above image
 title : "Custom title bar", 

 // See place holder 2 in above image
 defaultPath : "D:\\electron-app",

 // See place holder 3 in above image
 buttonLabel : "Custom button",

 // See place holder 4 in above image
 filters :[
  {name: 'Images', extensions: ['jpg', 'png', 'gif']},
  {name: 'Movies', extensions: ['mkv', 'avi', 'mp4']},
  {name: 'Custom File Type', extensions: ['as']},
  {name: 'All Files', extensions: ['*']}
 ],
 properties: ['openFile','multiSelections']
}

//Synchronous
let filePaths = dialog.showOpenDialog(WIN, options)
console.log('filePaths)

//Or asynchronous - using callback
dialog.showOpenDialog(WIN, options, (filePaths) => {
 console.log(filePaths)
})

【讨论】：