エレクトロン - メニューからファイルを開く

Question

私の電子アプリには「ファイルを開く」というボタンがあり、それをクリックすると開いているファイルのダイアログボックスが表示され、ファイルを選択できます。

アプリツールバーからメニュー項目をクリックすると、「ファイルを開く」ダイアログボックスを開くことはできますか？

これは、ツールバーメニューのサブメニューで私のラベルです：

label: 'Open', 
accelerator: 'CmdOrCtrl+O' 

私のような何かをしたい：

label: 'Open', 
accelerator: 'CmdOrCtrl+O', 
role: 'open' 

をしかし、「オープン」というような役割がありません。

オープンファイルダイアログボックスを開くクリックイベントを実装するにはどうすればよいですか？

Main.js開いているファイルのセクション：

const ipc = require('electron').ipcMain 
const dialog = require('electron').dialog 

ipc.on('open-file-dialog', function (event) { 
    dialog.showOpenDialog({ 
    properties: ['openFile', 'openDirectory'] 
    }, function (files) { 
    if (files) event.sender.send('selected-file', files) 
    }) 
}) 

index.js：

const ipc = require('electron').ipcRenderer 
const selectDirBtn = document.getElementById('open') 

selectDirBtn.addEventListener('click', function (event) { 
    ipc.send('open-file-dialog') 
}) 

ipc.on('selected-file', function (event, path) { 
    document.getElementById('selected-file').innerHTML = `► ${path}` 
    document.getElementById('selected-file2').innerHTML = `${path}` 
}) 

Answer 1

私は2つのボタン、非可視入力ファイルと可視なスタイルのボタンを持っていました。

<input type="file" id="fileId" style="display:none;" /> 
<button class="btn-lg btn-primary center-block" type="button" 
    id="btnLoadFile">Load File</button> 

jsでは、入力ファイルのクリックイベントをトリガーするために、スタイル付きボタンのクリックイベントを設定しました。

document.getElementById('btnLoadFile').addEventListener("click", function(){ 
    document.getElementById('fileId').click(); 
}); 

次に、入力ファイル要素の変更イベントリスナーがあります。このイベントリスナーは、ファイルの操作を行います。

document.getElementById('fileId').addEventListener('change', function(e){ 
    //use the file here 
    var files = e.target.files; 
    var f = files[0]; { 
     var reader = new FileReader(); 
     var name = f.name; 
     reader.onload = function (e) { 
      console.log(e.target.result); 
     }; 
     reader.readAsBinaryString(f); 
    } 
}); 

希望します。