dialog 模块提供了 api 来展示原生的系统对话框，例如打开文件框，alert 框，
所以 web 应用可以给用户带来跟系统应用相同的体验。
dialog.js
var {remote}=require('electron'); //https://electronjs.org/docs/api/dialog var errorDom=document.querySelector('#error'); var mesageBoxDom=document.querySelector('#mesageBox'); var openDialogDom=document.querySelector('#openDialog'); var saveDialogDom=document.querySelector('#saveDialog'); errorDom.onclick=function(){ remote.dialog.showErrorBox('警告','操作有误'); } mesageBoxDom.onclick=function(){ remote.dialog.showMessageBox({ type:'info', title:'提示信息', message:'内容', buttons:['ok','no'] },function(index){ console.log(index) }) } openDialogDom.onclick=function(){ remote.dialog.showOpenDialog({ // properties:['openDirectory','openFile'] properties:['openFile'] },function(data){ console.log(data); //["C:UsersAdministratorDesktop新建文件夹jsindex.js"] }) } saveDialogDom.onclick=function(){ remote.dialog.showSaveDialog({ title:'save file', defaultPath:"aaa.jpg", filters: [ {name: 'Images', extensions: ['jpg', 'png', 'gif']}, {name: 'Movies', extensions: ['mkv', 'avi', 'mp4']}, {name: 'Custom File Type', extensions: ['as']}, {name: 'All Files', extensions: ['*']} ] },function(path){ console.log(path); // C:UsersAdministratorDesktop新建文件夹jsaaa.jpg //保存以后会打印保存的路径 , 但是不会实现真的保存功能 （具体保存什么数据可以写在nodejs里面） }) }
index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <button id="error">失败提示框</button> <br> <br> <button id="mesageBox">showMessageBox</button> <br> <br> <button id="openDialog">showOpenDialog</button> <br> <br> <button id="saveDialog">showSaveDialog</button> <script src="renderer/dialog.js"></script> </body> </html>