Electron 中如何使用 Menu 类创建菜单？

推荐答案

在 Electron 中，可以使用 Menu 类来创建应用程序的菜单。以下是一个简单的示例，展示如何创建一个基本的菜单并将其设置为应用程序的菜单：

// www.javascriptcn.com code example
const { app, Menu } = require('electron');

// 创建菜单模板
const template = [
  {
    label: '文件',
    submenu: [
      {
        label: '新建',
        click: () => {
          console.log('新建文件');
        }
      },
      {
        label: '打开',
        click: () => {
          console.log('打开文件');
        }
      },
      {
        label: '保存',
        click: () => {
          console.log('保存文件');
        }
      },
      {
        type: 'separator'
      },
      {
        label: '退出',
        role: 'quit'
      }
    ]
  },
  {
    label: '编辑',
    submenu: [
      {
        label: '撤销',
        role: 'undo'
      },
      {
        label: '重做',
        role: 'redo'
      },
      {
        type: 'separator'
      },
      {
        label: '剪切',
        role: 'cut'
      },
      {
        label: '复制',
        role: 'copy'
      },
      {
        label: '粘贴',
        role: 'paste'
      }
    ]
  }
];

// 根据模板创建菜单
const menu = Menu.buildFromTemplate(template);

// 设置应用程序菜单
Menu.setApplicationMenu(menu);

本题详细解读

1. 引入 Menu 类

首先，需要从 electron 模块中引入 Menu 类。Menu 类用于创建和管理应用程序的菜单。

const { app, Menu } = require('electron');

2. 创建菜单模板

菜单模板是一个数组，数组中的每个对象代表一个菜单项。每个菜单项可以包含 label、submenu、click 等属性。

• label：菜单项的显示文本。
• submenu：如果存在，表示该菜单项是一个子菜单，包含多个子菜单项。
• click：点击菜单项时触发的回调函数。
• role：预定义的菜单项角色，如 undo、redo、cut、copy、paste 等。

// www.javascriptcn.com code example
const template = [
  {
    label: '文件',
    submenu: [
      {
        label: '新建',
        click: () => {
          console.log('新建文件');
        }
      },
      // 其他菜单项...
    ]
  },
  // 其他菜单...
];

3. 构建菜单

使用 Menu.buildFromTemplate 方法根据模板创建菜单对象。

const menu = Menu.buildFromTemplate(template);

4. 设置应用程序菜单

最后，使用 Menu.setApplicationMenu 方法将创建的菜单设置为应用程序的菜单。

Menu.setApplicationMenu(menu);

5. 其他注意事项

• role 属性可以简化一些常见的菜单项操作，如 quit、undo、redo 等。
• 可以通过 type: 'separator' 在菜单项之间添加分隔线。
• 菜单项可以嵌套，形成多级菜单。

通过以上步骤，你可以在 Electron 应用程序中创建并设置自定义菜单。