Question

我正在尝试使用electronjs创建一个简单的桌面应用程序。我的目标是打开一个ShowOpenDialog但是因为（我不明原因）它没有打开任何东西树视图：

sample app
 |-index.html
 |-js
   |--jquery.js
   |--index.js
 |-main.js
 |-package.json

的index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Hello World!</title>
  </head>
  <body>
    <h1>Hello World!</h1>
    <br />
    <button id="openFile">Open</button>
    <script>
        window.$ = window.jQuery = require('./js/jquery.js');
    </script>
    <sctipt src ="./js/index.js"></sctipt>
</html>

index.js

$(document).ready(function() {    
    $("#openFile").click(function(){
        dialog.showOpenDialog(function (fileNames) {
        }); 
    })    
})

main.js

'use strict';
const electron = require('electron');
const dialog = require('electron').dialog;
const app = electron.app;
const BrowserWindow = electron.BrowserWindow;

let mainWindow;

function createWindow () {
  mainWindow = new BrowserWindow({width: 800, height: 600});
  mainWindow.loadURL('file://' + __dirname + '/index.html');
  mainWindow.
  mainWindow.on('closed', function() {
    mainWindow = null;
  });
}

app.on('ready', createWindow);

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

app.on('activate', function () {
  if (mainWindow === null) {
    createWindow();
  }
});

和package.json

{
  "name": "electron-quick-start",
  "version": "1.0.0",
  "description": "A minimal Electron application",
  "main": "main.js",
  "scripts": {
    "start": "electron main.js"
  }
}

Answer 1

您需要在主进程中使用dialog，但请尝试在渲染器进程中使用它。这不行。您应该使用remote模块获取对主进程'dialog的引用，或使用ipc模块向主进程发送消息以打开对话框。

作为最小示例，请尝试将index.js中的dialog替换为require('electron').remote.require('dialog');但是，从长远来看，我建议改用IPC。

Answer 2

你不能只是威胁渲染器进程作为主进程

你可以像这样使用远程或使用ipc

index.js

const electron = require("electron")
const ipc = electron.ipcRenderer

$(document).ready(function() {    
    $("#openFile").click(function(){
        ipc.send("openF")
    })    
})

在 main.js 中

添加

const ipc = electron.ipcMain
ipc.on("openF", function(){
  const { dialog } = require('electron')
  dialog.showOpenDialog({title: "Open File",properties : ['openFile']}).then(result =>{
    mainWindow.webContents.send("filepaths", result.filePaths);

})

哦，是的，因为你需要文件路径，你在 index.js 上需要这个

ipcRenderer.on("filepaths", function(event, message) {
  if(message == undefined) return
  else{
    console.log(message); // Logs filepaths

    if(fl !== ""){
     console.log("no filepath found")
    }
}
// if you wanna open file use fs
})

无法使用electronjs和jquery showOpenDialog

2 个答案: