Question

我是electronicjs的新手，并且正在开发一个小型应用程序，该应用程序读取json文件并构建小型html表单并返回用户输入的值。因此，我在javascript中开发了小脚本，这些小脚本链接到html“按钮”标签以调用对话框，以便用户可以输入目录，文件并保存最终形式。一切都很好...在electronjs“ ^ 3.1.13”上。但是，如果我要更新到lib的最新版本（“ ^ 8.2.5”），那么我所有的炫酷ShowOpenDialog根本无法正常工作。有什么线索吗？这是打开文件夹的脚本（如果有帮助的话）：

{
 let myName = document.currentScript.getAttribute('name');
 const ipc       = require('electron').ipcRenderer;

 let  asyncBtn  = document.querySelector('#folder-selector-'+myName);
 let replyField = document.querySelector('#folder-selector-content-'+myName);
 let onButtonClick = function() {
     const { dialog } = require('electron').remote;
     let dialogOptions = {
       title: "Choisir un dossier:",
       properties: ['openDirectory','promptToCreate'],
     };
     dialog.showOpenDialog(
         dialogOptions,
         fileNames => {
           if (fileNames === undefined) {
             console.log("No file selected");
           } else {
             console.log('file:', fileNames[0]);
             replyField.value = fileNames[0];
           }
     })
 };

 asyncBtn.addEventListener("click", onButtonClick);

}

非常感谢您的帮助。

Answer 1

除了在最近版本的Electron中确实已更新对dialog.showOpenDialog的调用，并返回一个promise而不使用回调函数的事实之外，更新的代码还有另一个缺陷：读取上述文档页面显示getCurrentWindow()不是dialog的方法；可以从remote获得它，因此您必须明确地添加它：

 const { dialog, getCurrentWindow } = require('electron').remote;

然后只需从dialog.showOpenDialog内部调用它即可：

 dialog.showOpenDialog( getCurrentWindow(), dialogOptions).then(result => {

但这是一个错误，您可以通过查看DevTools的控制台来发现自己，该控制台将显示：

TypeError：dialog.getCurrentWindow不是函数

Answer 2

最新版本的showOpenDialog接收两个参数：可选的BrowserWindow和选项作为第二个参数。它返回promise，不需要回调。 https://github.com/electron/electron/blob/8-x-y/docs/api/dialog.md#dialogshowopendialogbrowserwindow-options

因此，您需要将回调逻辑更改为Promise。

let onButtonClick = function() {
     const { dialog } = require('electron').remote;
     let dialogOptions = {
       title: "Choisir un dossier:",
       properties: ['openDirectory','promptToCreate'],
     };
     dialog.showOpenDialog(
         dialogOptions
     ).then((fileNames)=>{
           if (fileNames === undefined) {
             console.log("No file selected");
           } else {
             console.log('file:', fileNames[0]);
             replyField.value = fileNames[0];
           }
     }).catch(err=>console.log('Handle Error',err))


 };

 asyncBtn.addEventListener("click", onButtonClick);

Answer 3

非常感谢弗拉基米尔。因此，我尝试按照说明的方法更新代码，将电子封装更新为版本8.2.5，并按照您的说明修改脚本，但效果没有任何改善。如果一切顺利，此代码应该正确，但不适用于电子版8.2.5。您仍然在此看到任何错误吗？

 {
 let myName = document.currentScript.getAttribute('name');
 const ipc       = require('electron').ipcRenderer;

 let  asyncBtn  = document.querySelector('#folder-selector-'+myName);
 let replyField = document.querySelector('#folder-selector-content-'+myName);
 let onButtonClick = function() {
     const { dialog } = require('electron').remote;

     let dialogOptions = {
       title: "Choisir un dossier:",
       properties: ['openDirectory','promptToCreate']
     };
     dialog.showOpenDialog( dialog.getCurrentWindow(), dialogOptions).then(result => {
     if(!result.canceled) {
          replyField.value = result.filePaths[0];
      }
     }).catch(err => {
       console.log(err)
     })
 };
 asyncBtn.addEventListener("click", onButtonClick);
 }

Answer 4

好，终于明白了。除了我最感激的帮助外，我也错过了 “ webPreferences”：{ nodeIntegration：正确 } 在main.js中使其正常运行。开发人员工具的发现也有很大帮助：）

现在一切都很好了。非常感谢！

ShowOpenDialog在最新版本的electronic-js上不起作用

4 个答案: