QML Menu动态添加子Menu

自用 防忘。在网上找了半天没看到合适的，问了半天AI也没结果，只好自己写一个。

动态

动态添加需要用JS代码和Component组件：

menuBar: MenuBar {
    Menu {
        id: menu
        title: 'menu'
        MenuItem {
            text: 'a'
        }
        MenuItem {
            text: 'b'
        }
    }
}

Component {
    id: subMenu
    Menu {
        property var subItem
        Repeater {
            model: subItem
            MenuItem {
                text: modelData
            }
        }
    }
}

//动态添加子菜单
Component.onCompleted: {
    var tmp = {  //你要添加的数据，可以来自C++、QML或任何地方
        "subMenu1": ['s1', 's2', 's3'],
        "subMenu2": ['m1', 'm2']
    }
    Object.keys(tmp).forEach(key => {
        menu.addMenu(subMenu.createObject(menu, {
            "title": key,
            "subItem": tmp[key]
        }))
    })
}

效果：

静态

静态不用这么麻烦，可以直接嵌套：

Menu {
    title: 'menu'
    MenuItem {
        text: 'a'
    }
    MenuItem {
        text: 'b'
    }
    Menu { //嵌套
        title: 'subMenu'
        MenuItem {
            text: 's1'
        }
        MenuItem {
            text: 's2'
        }
    }
}

效果：

Component很好用，不会用的朋友可以去翻一下官方文档。