浅浅element-ui导航栏封装使用学习一下

封装组件SubMenu.vue：

使用：

（这里导航数据是后台获取的）usermenu数据格式：

usermenu:[
    {
        menuId:'1',
        name:'一级菜单1',
        url:'./views/homePage',
        hasChildren:0,
        childList:[]
    },
    {
        menuId:'2',
        name:'一级菜单2',
        url:'',
        hasChildren:2,
        childList:[
            {
                menuId:'2-1',
                name:'二级菜单',
                url:'./views/Test',
                hasChildren:0,
                childList:[]
            },
            {
                menuId:'2-2',
                name:'二级菜单',
                url:'./views/Test2',
                hasChildren:0,
                childList:[]
            },
        ]
    },
    {
        menuId:'3',
        name:'一级菜单3',
        url:'./views/Test3',
        hasChildren:0,
        childList:[]
    },
]

url路径为定义的对应路由路径

最终实现：

 

 

菜鸟学习记录，如有侵犯，请联系删除，如有任何问题请大佬们多多指教，O(∩_∩)O谢谢