在电子应用程序中使用contextBridge/preload时如何更新反应状态

Question

我有一个电子应用程序，正在使用react。我在preload.js中使用contextBridge。我想通过桥将一个变量从app.js传递给主进程中的一个函数；它将一个值返回到桥接器并返回到app.js，在那里它将以某种方式更新状态并触发重新应答器。下面的代码一直工作到获取要更新的状态。我不明白如何将一个变量从preload.js获取到app.js？我的临时破解方法是从预加载中设置localstorage，并调用setTimeout函数来观察特定变量的变化。我知道这是一个不太有趣的方法。代码在这里：

app.js-

async function createSpreadsheet() {
let x = await electron.google.createSpreadsheetFiles(sheetFileName)
}

preload.js-

const { ipcRenderer, contextBridge, net } = require('electron');
contextBridge.exposeInMainWorld('electron', {
google: {
createSpreadsheetFiles(name) {
ipcRenderer.send('gCreateSpreadSheetFile', name);
let x = ipcRenderer.on('gCreateSpreadSheetFile-return', function (event, arg) {
})
return x
},
},
})

main.js-

ipcMain.on('gCreateSpreadSheetFile', (event, name) => {
async function all() {
let resp = await g.createSheetFile(name, win)
event.sender.send('gCreateSpreadSheetFile-return', resp)
}
all()
})

Answer 1

您可以使用ipcRenderer invoke和ipcMain handle:

preload.js

contextBridge.exposeInMainWorld('electron', {
google: {
createSpreadsheetFiles: (name) => ipcRenderer.invoke('gCreateSpreadSheetFile-invoke', name),
},
});

main.js

ipcMain.handle('gCreateSpreadSheetFile-invoke', (event, name) => {
return 'value';
});

renderer

window.electron.google.createSpreadsheetFiles(spreadSheetName).then((value) => {
console.log(value);
});
// or
var value = await window.electron.google.createSpreadsheetFiles(spreadSheetName);

在文件上：https://www.electronjs.org/docs/api/ipc-renderer#ipcrendererinvokechannel-args

Answer 2

好的，我很抱歉在回答部分发布了另一个问题，我不明白如何在评论响应中格式化代码。

此代码仍然不会返回到app.js:

app.js    
const res = await electron.g.createSpreadsheetFiles(sheetFileName)
console.log(res) // prints undefined, before code is excecuted

在不等待preload.js返回的情况下返回res

preload.js    
g: {
createSpreadsheetFiles(name) {
(async () => {
const result = await ipcRenderer.invoke('gCreateSpreadSheetFile-invoke',  name);
return result; 
})();
}