电子展示OpenDialog箭头函数（event.send）不工作
下面是打开文件的对话框示例：https://github.com/electron/electron-api-demos
我从示例中复制了代码。“打开文件”对话框实际上是有效的，我可以选择一个文件，但不明白为什么将文件路径发送回渲染器的箭头函数不起作用（console.log中没有记录任何内容）。
有人能看出哪里不对劲吗？该项目是使用electron forge启动的，我的操作系统是linux。谢谢
index.js
const { app, BrowserWindow, ipcMain, dialog, } = require('electron');
require('electron-reload')(__dirname);
const path = require('path');
// Handle creating/removing shortcuts on Windows when installing/uninstalling.
if (require('electron-squirrel-startup')) { // eslint-disable-line global-require
app.quit();
}
const createWindow = () => {
// Create the browser window.
const mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true
}
});
// and load the index.html of the app.
mainWindow.loadFile(path.join(__dirname, 'index.html'));
// Open the DevTools.
mainWindow.webContents.openDevTools();
};
// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.on('ready', createWindow);
// Quit when all windows are closed.
app.on('window-all-closed', () => {
// On OS X it is common for applications and their menu bar
// to stay active until the user quits explicitly with Cmd + Q
if (process.platform !== 'darwin') {
app.quit();
}
});
app.on('activate', () => {
// On OS X it's common to re-create a window in the app when the
// dock icon is clicked and there are no other windows open.
if (BrowserWindow.getAllWindows().length === 0) {
createWindow();
}
});
// In this file you can include the rest of your app's specific main process
// code. You can also put them in separate files and import them here.
ipcMain.on('open-file-dialog', (event) => {
dialog.showOpenDialog(
{
properties: ['openFile',]
},
(files) => {
console.log('ok')
if (files) {
event.sender.send('select-file', files)
}
})
})
index.html
<!DOCTYPE html>
<html>
<head>
<title>Hello</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div>
<div>
<button class="demo-button" id="select-directory">Select file</button>
<span class="demo-response" id="selected-file"></span>
</div>
<br><br>
</div>
<script>
const electron = require('electron')
const { ipcRenderer } = electron
const selectDirBtn = document.getElementById('select-directory')
selectDirBtn.addEventListener('click', (event) => {
ipcRenderer.send('open-file-dialog')
})
ipcRenderer.on('select-file', (event, path) => {
console.log(path)
document.getElementById('selected-file').innerHTML = `You selected: ${path}`
})
</script>
</body>
</html>
共有1个答案
随着Electron 6的发布，dialog API已被修改。
dialog.showOpenDialog（）和其他对话框函数现在返回promise，不再接受回调函数。还有以阻塞方式返回选择结果的同步副本，例如dialog.showOpenDialogSync（）。
示例用法（在渲染器进程中）
const remote = require("electron").remote
const dialog = remote.dialog
dialog.showOpenDialog(remote.getCurrentWindow(), {
properties: ["openFile", "multiSelections"]
}).then(result => {
if (result.canceled === false) {
console.log("Selected file paths:")
console.log(result.filePaths)
}
}).catch(err => {
console.log(err)
})
截至2020年2月，electron api演示使用electron 5。这就是为什么他们的对话框调用代码仍然使用旧表单的原因。
-
不鼓励将箭头函数（“lambdas”）传递给 Mocha。Lambdas词法绑定 this，无法访问 Mocha 上下文。例如，以下代码将失败： describe('my suite', () => { it('my test', () => { // should set the timeout of this test to 1000 ms; instead will fail thi
-
ES6标准新增了一种新的函数：Arrow Function（箭头函数）。 为什么叫Arrow Function？因为它的定义用的就是一个箭头： x => x * x 上面的箭头函数相当于： function (x) { return x * x; } 在继续学习箭头函数之前，请测试你的浏览器是否支持ES6的Arrow Function： 'use strict'; ---- var f
-
新的“胖箭头”符号还可以用更简单的方式来定义匿名函数。 请看下面的例子： console.log(x); incrementedItems.push(x+1); }); 计算一个表达式并返回值的函数可以被定义更简单： 下面代码与上面几乎等价： incrementedItems = items.map(function (x) { return x+1; 让我们在 验
-
我目前试图从react中实现tic tac toe示例，但使用的是钩子和ES6标准，但我似乎无法调用USEstate。我不断得到这些错误： 第6:33行：React Hook“usestate”在函数“game”中被称为，它既不是React函数组件，也不是自定义React Hook函数react-hooks/rules-of-hooks 这是我当前的代码： 多谢！
-
主要内容：1.语法变化,2.带参数的箭头函数,3.带有默认参数的箭头函数,4.带有Rest参数的箭头函数,5.无括号的箭头函数,6.箭头函数的优点ES6中引入了箭头(Arrow)函数，它提供了一种更准确的JavaScript编写方法。 它们让我们能够编写较小的函数语法。 箭头函数的代码更具可读性和结构性。 箭头函数是匿名函数(没有名称且未与标识符绑定的函数)。 它们不返回任何值，并且可以在不使用关键字的情况下进行声明。 箭头函数不能用作构造函数。 箭头函数中的上下文是按词汇或静态方式定义的。 它
-
本文向大家介绍ES6箭头函数和扩展实例分析，包括了ES6箭头函数和扩展实例分析的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了ES6箭头函数和扩展。分享给大家供大家参考，具体如下： 1.默认值 在ES6中给我们增加了默认值的操作相关代码如下： 可以看到现在只需要传递一个参数也是可以正常运行的。 输出结果为：2。 2.主动抛出错误 ES6中我们直接用throw new Error( xxxx