electron
1,在项目打开第三方网站
》1主进程中写
var BrowserView = electron.BrowserView //引入BrowserView
var view = new BrowserView() //new出对象
mainWindow.setBrowserView(view) // 在主窗口中设置view可用
view.setBounds({x:0,y:100,width:1200, height:800}) //定义view的具体样式和位置
view.webContents.loadURL('https://jspang.com') //wiew载入的页面
》2在渲染层用webview
<webview src=""></webview>
2,自定义菜单
const { Menu ,BrowserWindow} = require('electron')
var template = [
{
label:'凤来怡洗浴会所',
submenu:[
{
label:'精品SPA',
//主要代码--------------start
click:()=>{
win = new BrowserWindow({
width:500,
height:500,
webPreferences:{ nodeIntegration:true}
})
win.loadFile('yellow.html')
win.on('closed',()=>{
win = null
})
}
//主要代码----------------end
},
{label:'泰式按摩'}
]
},
{
label:'大浪淘沙洗浴中心',
submenu:[
{label:'牛奶玫瑰浴'},
{label:'爱情拍拍手'}
]
}
]
var m = Menu.buildFromTemplate(template)
Menu.setApplicationMenu(m)
然后再打开主进程main.js文件,在ready生命周期中,直接加入下面的代码,就可以实现自定义菜单了。
require('./main/menu.js')
3,绑定快捷键的属性是accelerator属性,比如我们新打开一个窗口,我们就的代码可以写成这样
const { Menu ,BrowserWindow} = require('electron')
var template = [
{
label:'凤来怡洗浴会所',
submenu:[
{
label:'精品SPA',
accelerator:`ctrl+n`, //这里是主要代码
click:()=>{
win = new BrowserWindow({
width:500,
height:500,
webPreferences:{ nodeIntegration:true}
})
win.loadFile('yellow.html')
win.on('closed',()=>{
win = null
})
}
},
{label:'泰式按摩'}
]
},
{
label:'大浪淘沙洗浴中心',
submenu:[
{label:'牛奶玫瑰浴'},
{label:'爱情拍拍手'}
]
}chengxu
]
var m = Menu.buildFromTemplate(template)
Menu.setApplicationMenu(m)
4,当我们要使用Menu模块,它是主线中的模块,如果想在渲染线程中使用,就必须使用remote。代码如下:
const { remote} = require('electron')
var rigthTemplate = [
{label:'粘贴'},
{label:'复制'}
]
var m = remote.Menu.buildFromTemplate(rigthTemplate)
window.addEventListener('contextmenu',function(e){
//阻止当前窗口默认事件
e.preventDefault();
//把菜单模板添加到右键菜单
m.popup({window:remote.getCurrentWindow()})
})
5,程序打开调试模式
mainWindow.webContents.openDevTools()
版权声明:本文由Web学习之路发布,如需转载请注明出处。