Как разделить MenuItem на собственный модуль в Electron? - PullRequest
Новая
       27

Как разделить MenuItem на собственный модуль в Electron?

0 голосов
/ 16 марта 2019

Новое в Electron и создании меню. Я пытаюсь выяснить, могу ли я отделить MenuItem, чтобы предотвратить огромный файл, но у меня возникают проблемы. Например, я отделил код меню от main.js и переместил меню в каталог рендерера в каталог Menu. Я могу вызвать меню из main.js с: 

let mainMenu = Menu.buildFromTemplate(require('./renderer/Menus/mainMenu'))

mainMenu.js 

module.exports = [
    {
        label: 'Foo',
        id: 'itemFoo',
        submenu: [
            {label: 'Enter Foo'},
            {label: 'Exit Foo'}
        ]
    },
    {
        label: 'Bar',
        id: 'itemBar',
        submenu: [
            {label: 'Enter Bar'},
            {label: 'Exit Bar'}
        ]
    }   
]

и это работает, но можно ли разделить каждый пункт меню дальше в свой собственный файл, и какой будет правильный способ сделать это?

Я пытался взять mainMenu.js и кодировать его как: 

const foo = require('./itemFoo')

module.exports = [
    {foo},
    {
        label: 'Bar',
        id: 'itemBar',
        submenu: [
            {label: 'Enter Bar'},
            {label: 'Exit Bar'}
        ]
    }   
]

itemFoo.js: 

module.exports = [
    {
        label: 'Foo',
        id: 'itemFoo',
        submenu: [
            {label: 'Enter Foo'},
            {label: 'Exit Foo'}
        ]
    }
]

но я получаю ошибку:

TypeError: Неверный шаблон для MenuItem: должен иметь хотя бы один из ярлык, роль или тип

Можно ли выделить элемент меню в Electron в свой собственный модуль и если да, то как это сделать? Я не упоминал об этом при поиске [электронный] пункт меню или в документации

Ответы [ 2 ]

0 голосов
/ 18 марта 2019

Я понял, что я делаю неправильно. Я неправильно писал пункты меню. Должно быть:

main.js: 

const { Menu } = require('electron')

let mainMenu = Menu.buildFromTemplate(require('./renderer/Menus/mainMenu'))

app.on('ready', () => {
  mainWindow.createWindow(),
  Menu.setApplicationMenu(mainMenu)
})

mainMenu.js: 

const foo = require('./itemFoo')
const bar = require('./itemBar')

module.exports = [
    foo,
    bar
]

itemBar.js: 

module.exports = {
    label: 'Foo',
    id: 'itemFoo',
    submenu: [
        {label: 'Enter Foo'},
        {label: 'Exit Foo'}
    ]
}

itemFoo.js: 

module.exports = {
    label: 'Bar',
    id: 'itemBar',
    submenu: [
        {label: 'Enter Bar'},
        {label: 'Exit Bar'}
    ]
}

Это позволит мне иметь каждый элемент главного меню в отдельном файле и очистить main.js .

0 голосов
/ 17 марта 2019

Это должно работать (хотя и не проверено):

основной процесс : 

let mainMenuTemplate =
[
    require('./renderer/Menus/itemFoo'),
    require('./renderer/Menus/itemBar')
];
let mainMenu = Menu.buildFromTemplate(mainMenuTemplate);

itemFoo.js 

module.exports =
{
    label: 'Foo',
    id: 'itemFoo',
    submenu: [
        {label: 'Enter Foo'},
        {label: 'Exit Foo'}
    ]
};

itemBar.js 

module.exports =
{
    label: 'Bar',
    id: 'itemBar',
    submenu: [
        {label: 'Enter Bar'},
        {label: 'Exit Bar'}
    ]
};

Примечание: промежуточный файл mainMenu.js, вероятно, тогда не нужен ...

...