有啥方法可以更改电子文件对话框的标题和保存类型？

Posted 2023-03-22

【中文标题】有啥方法可以更改电子文件对话框的标题和保存类型？

【英文标题】：Is there any way to change the title and save type of file dialog on electron?有什么方法可以更改电子文件对话框的标题和保存类型？

【发布时间】：2021-12-17 13:36:23

【问题描述】：

我创建了一个按钮，用于下载和保存从 api 端点返回的文件。

在普通浏览器中，点击按钮后，会出现一个保存文件对话框，标题为Save As，Save as type由文件扩展名显示。但在electron 中，标题似乎是一个文件网址（在我的情况下，它显示blob://https:... 因为我的是用URL.createObjectURl 创建的）。

那么我需要设置为a标签以使对话框标题为Save As并更正文件的保存类型（不使用电子本机对话框）的任何选项吗？

...
<a hidden href='/' ref=downloadRef>download</a>
<button onClick=handleSaveFile>download</button>
...

const handleSaveFiles = (file: Blob, fileName: string): void => 
  const fileDownloadUrl = window.URL.createObjectURL(file);
  if (downloadRef.current) 
    downloadRef.current.href = fileDownloadUrl;
    downloadRef.current.download = fileName;
    downloadRef.current.click();
  
;

【参考方案1】：

其实点击那个按钮时打开的对话框已经是electron的对话框，然后我可以通过will-download事件编辑标题和过滤器。

...
this.browserWindow = new BrowserWindow(option);
...
this.browserWindow.webContents.session.on('will-download', (event, item) => 
 let filters = [];
 switch (item.getMimeType()) 
  case 'text/csv':
   filters = [ name: 'Microsoft Excel Comma Separated Values File', extensions: ['csv'] ];
   break;
  case 'application/octet-stream':
   filters = [ name: 'Zip archive', extensions: ['zip'] ];
   break;
  default:
   break;
 

 item.setSaveDialogOptions(
   title: 'Save As',
   filters: [...filters,  name: 'All Files', extensions: ['*'] ],
 );
);

参考https://www.electronjs.org/docs/latest/api/download-item#downloaditemsetsavedialogoptionsoptions