仅在Mac以外的设备上添加子菜单项：Electron JS

编程问答 2022-06-11

问题描述

我想在Electron JS应用程序的“文件”菜单项下添加一个“退出”子菜单项，但 仅在Windows和Linux上@H_404_3@ 。在Mac上，我已经在“应用程序名称”菜单项下设置了“退出”子菜单项。目前，这是我的代码：

function createMenu(){
    const isMac = process.platform === 'darwin';
    const menu = [
        
        {
            label: "File",submenu: [
                {
                    label: 'Add expense',},!isMac && { 
                    label: 'Quit',click(){
                        app.quit()
                    },accelerator: 'Ctrl+Q'
                }
            ]
        },{
            label: "Menu2",submenu: [{label: 'Ok'}]
        }
    ];


    // Mac First Item in Template refers to app name (won't be able to override unless you package application)
    isMac && menu.unshift({
        label: app.name,submenu: [
            {
                label: 'About',click(){
                    open('https://www.google.com') // Using the open package
                }
            },{
                label: 'Quit',click(){
                    app.quit()
                },accelerator: 'Cmd+Q'
            }
        ]
    })


    return menu;
    
}

但是，运行此命令时，我收到一条错误消息

TypeError: Invalid template for MenuItem: must have at least one of label,role or type

我应该怎么做？

谢谢！

解决方法

由于尝试在列表文字中有条件地插入对象的方式而导致出现错误。

// The not macOS case:
> [ {"foo": 15},true && {"bar": 123} ]
[ { foo: 15 },{ bar: 123 } ]

// The macOS case:
> [ {"foo": 15},false && {"bar": 123} ]
[ { foo: 15 },false ]

在后一种情况下，最终将一个false元素插入到数组中，这就是为什么会出现错误的原因。

如果要使用这样的速记，可以使用：

> [ {"foo": 15},...(true?[{"bar": 123}]:[]) ]
[ { foo: 15 },{ bar: 123 } ]

> [ {"foo": 15},...(false?[{"bar": 123}]:[]) ]
[ { foo: 15 } ]

在您的用例中，这将使您：

const menu = [
    {
        label: "File",submenu: [
            {
                label: 'Add expense',},...(!isMac)?[{ 
                label: 'Quit',click(){
                    app.quit()
                },accelerator: 'Ctrl+Q'
            }]:[]
        ]
    },{
        label: "Menu2",submenu: [{label: 'Ok'}]
    }
];

或者，您可以简单地调整菜单模板：

const menu = [
    {
        label: "File",}
        ]
    },submenu: [{label: 'Ok'}]
    }
];

if (!isMac) {
    menu[0]["submenu"].push({ 
        label: 'Quit',click(){
            app.quit()
        },accelerator: 'Ctrl+Q'
    })
}

使用哪种取决于您；在第二种情况下，如果结构发生更改，则可能需要更新菜单地址。您还应该权衡可读性。

javascriptmenumenuitem