electron版本：v18.1.0

一、主进程引入Menu模块

const { Menu } = require('electron')

二、编写菜单数据并启用

const { Menu } = require('electron')
var template = [
    {
        label: '菜单A',//一级菜单名称
        submenu: [ //定义子菜单
            { label: '菜单A1' },
            { label: '菜单A2' }
        ]
    },
    {
        label: '菜单B',
        submenu: [
            { label: '菜单B1' },
            { label: '菜单B2' }
        ]
    }
]

var m=Menu.buildFromTemplate(template)

Menu.setApplicationMenu(m)

三、完整代码

main.js

var electron = require('electron') //引入electron组件

var app = electron.app //引入组件app

var BrowserWindow = electron.BrowserWindow //窗口引用

var mainWindow = null //申明打开窗口

app.on('ready', () => { //app初始化参数
    mainWindow = new BrowserWindow({
        windth: 800,
        height: 800,
        webPreferences: {
            nodeIntegration: true,
            contextIsolation: false,
            enableRemoteModule: true
        }
    })
    require('./main/menu.js')
    mainWindow.loadFile('index.html') //打开窗口加载的页面
    mainWindow.on('close', () => { //窗口关闭时，释放页面
        mainWindow = null
    })
})

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>menu</title>
</head>
<body>
   menu
</body>
</html>

menu.js

const { Menu } = require('electron')
var template = [
    {
        label: '菜单A',//一级菜单名称
        submenu: [ //定义子菜单
            { label: '菜单A1' },
            { label: '菜单A2' }
        ]
    },
    {
        label: '菜单B',
        submenu: [
            { label: '菜单B1' },
            { label: '菜单B2' }
        ]
    }
]

var m=Menu.buildFromTemplate(template)

Menu.setApplicationMenu(m)

四、运行效果

 electron .

0 条评论