How to show an open file native dialog with Electron?

Question

I am trying to add functionality to my Electron app that will allow users to open a file in the app, specifically plain text files. After looking at the Electron documentati

Answer 1

On the main process you can use

const {dialog} = require('electron');

dialog.showOpenDialog({properties: ['openFile'] }).then(function (response) {
    if (!response.canceled) {
        // handle fully qualified file name
      console.log(response.filePaths[0]);
    } else {
      console.log("no file selected");
    }
});

response looks like:

{
 canceled: false,
 filePaths: [
    '<fullpath>/<filename>'
 ]
}

Answer 2

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

document.querySelector('#selectBtn').addEventListener('click', function (event) {
    dialog.showOpenDialog({
        properties: ['openFile', 'multiSelections']
    }, function (files) {
        if (files !== undefined) {
            // handle files
        }
    });
});