通过Electronjs project中的参数subwindow的最佳方法是什么

问题描述 投票:0回答:1
在Electron Appication打开新的子窗口时,如何通过参数customer_id

我尝试使用modal.loadfile(

${__dirname}/pages/Company/login.html?id=1234

) 但是出现错误 电子:无法加载URL:file:///users/excelgraphics/documents/regular%20jobs/oot/aux%20service/aux%20services/pages/newservice.html%3fid=1234带有错误:

const popupLogin = (htmlFile, parentWindow, width, height) => {
    let modal = new BrowserWindow({
        width: 600,
        height: 500,
        modal: true,
        resizable: false,
        icon: path.join(__dirname + '/public/auxwall/logos/favicon.png'),
        parent: MainWindow,
        frame: false,
        webPreferences: {
            preload: path.join(__dirname, 'preload.js'),
            contextIsolation: false,
            nodeIntegration: true,

        }
    })

    modal.loadFile(`${__dirname}/pages/Company/login.html`)

    return modal;
}

我尝试这样做
如何将一个从Mainwindow发送到Electron JS中的Childwindow的变量?
但模态窗口无法从主进程访问消息

有人可以帮助我解决这个问题吗?

记住您的模态只是一个没有框架的窗口,可以通过使用

Inter-process Communication来回传递数据。

要开始确保您的电子应用程序,您应该真正阅读

Context隔离
javascript node.js electron
1个回答
1
投票
要将

id传递到新创建的窗口,请使用{window}.webcontents.send

method.

加载页面后立即立即将login.html发送到窗口。

在您的主线程脚本...

id
const popupLogin = (htmlFile, parentWindow, width, height) => { // Get the customers id from whatever source necessary. let id = 99; // Create the window. let modal = new BrowserWindow({ width: 600, height: 500, modal: true, resizable: false, icon: path.join(__dirname + '/public/auxwall/logos/favicon.png'), parent: MainWindow, frame: false, show: false, // Hide possible flash and DOM update(s). webPreferences: { preload: path.join(__dirname, 'preload.js'), contextIsolation: true, // Set to true nodeIntegration: true, // Node integration (removed in Electron v12) } }) // Load the window. // Note: The loadFile() method returns a promise. modal.loadFile(`${__dirname}/pages/Company/login.html`) .then(() => { modal.webContents.send('login:id', id); }) .then(() => { modal.show(); }) // Now show the modal return modal; }

(主线程)

preload.js
const contextBridge = require('electron').contextBridge;
const ipcRenderer = require('electron').ipcRenderer;

// White-listed channels.
const ipc = {
    'render': {
        // From render to main.
        'send': [],
        // From main to render.
        'receive': [
            'login:id'
        ],
        // From render to main and back again.
        'sendReceive': []
    }
};

contextBridge.exposeInMainWorld(
    // Allowed 'ipcRenderer' methods.
    'ipcRender', {
        send: (channel, args) => {
            let validChannels = ipc.render.send;
            if (validChannels.includes(channel)) {
                ipcRenderer.send(channel, args);
            }
        },
        receive: (channel, listener) => {
            let validChannels = ipc.render.receive;
            if (validChannels.includes(channel)) {
                // Deliberately strip event as it includes `sender`
                ipcRenderer.on(channel, (event, ...args) => listener(...args));
            }
        },
        invoke: (channel, args) => {
            let validChannels = ipc.render.sendReceive;
            if (validChannels.includes(channel)) {
                return ipcRenderer.invoke(channel, args);
            }
        }
    }
);

(渲染线)

login.html

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" type="text/css" href="style.css"> <script type="module" src="login.js"></script> </head> <body> .... </body> </html>

(渲染线)

login.js
    

最新问题
© www.soinside.com 2019 - 2025. All rights reserved.