Closed yehtut-indexzero closed 2 years ago
why not use iframe in vue page and position a button, then use browserwindow open this vue page
why not use iframe in vue page and position a button, then use browserwindow open this vue page
button is not static. There will be configuration file to handle the button position.
@yehtut-indexzero Demo: https://github.com/klren0312/electronExecuteJavaScriptDemo
preload.js
in src
vue.config.js
module.exports = {
pluginOptions: {
electronBuilder: {
preload: { preload: 'src/preload.js' },
nodeIntegration: true // 渲染模式可以使用node
}
}
}
preload.js
Easy to call ipcRenderer
, use window.ipcRenderer
window.ipcRenderer = require('electron').ipcRenderer
Open new window, that open the url, and add the button
async function createSecondWindow() {
secondWin = new BrowserWindow({
width: 300,
height: 300,
webPreferences: {
nodeIntegration: true,
contextIsolation: false,
preload: path.join(__dirname, 'preload.js')
}
})
secondWin.webContents.loadURL('https://www.baidu.com')
// add the button, and add click event to ipc
secondWin.webContents.executeJavaScript(`
const btn = document.createElement('button')
btn.innerText = 'test'
btn.style.position = 'absolute'
btn.style.top = '20%'
btn.style.left = '20%'
btn.style.zIndex = '999999'
document.body.appendChild(btn)
btn.addEventListener('click', () => {
window.ipcRenderer.send('test', 'test')
})
`, true)
secondWin.webContents.openDevTools()
}
// test
ipcMain.on('test', (e, v) => {
console.log(v)
})
ipcMain.on('openSecondWindow', () => {
setTimeout(() => createSecondWindow(), 400)
})
Sorry for the delayed response, had to take a break from open source to focus on school.
Your question doesn't seem to be specific to this plugin, just about electron. I'd suggest asking for help on a forum somewhere if the above suggestion doesn't work. Thanks for trying to help @klren0312.
I have browserview and load a website. This is code in vue component.
export default {
name: "HelloWorld",
props: {
msg: String,
},
created() {
ipcRenderer.send("load-url","https://github.com/");
},
};
</script>
This is the code in background.js
ipcMain.on("load-url", (event, arg) => {
browserview = new BrowserView();
win.addBrowserView(browserview);
const contentBounds = win.getContentBounds();
browserview.setBounds({
x: 0,
y: 0,
width: contentBounds.width,
height: contentBounds.height,
});
browserview.setAutoResize({ width: true, height: true });
browserview.webContents.loadURL(arg);
});`what I want to do is to add a button on github website (example) .
Can anyone help me to give any suggestion?