本文实例为大家分享了vue+quasar使用递归实现动态多级菜单的具体代码,供大家参考,具体内容如下
效果图:
菜单初始化入口 menu.vue,初始化侧边栏菜单组建,
菜单递归入口
参数说明
@my-router 菜单配置信息
@init-level 初始化菜单缩进大小
菜单元素递归执行体
{{item.Label_text}}
菜单元素解释
menuList: [ { icon: 'inbox', //图标 label: '菜单1', //label children: [ { icon: 'perm_identity', label: '菜单1-1', path: '/about' //路径 }, { icon: 'delete', label: '菜单1-2', children: [ { icon: 'settings', label: '菜单2-1', path: '/noty' } ] } ] }, { isItemLabel: true, //是否分隔栏 Label_text: 'item-label ' //分隔栏label }, { icon: 'feedback', label: '菜单数据结构', path: '/test', hidden: false //是否隐藏 } ]
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。