关于iview中Menu 导航菜单 循环嵌套 多级嵌套

介绍：

菜单通过后端接口请求数据来进行渲染

达到图中所示例的效果（ps：图中仅展示二级菜单，可根据需求三级四级）

开始撸代码。

这是官方的菜单代码。

            
                
                    
                    文章管理
                    评论管理
                    举报管理
                
                
                    
                    新增用户
                    活跃用户
                
                
                    
                    
                        新增和启动
                        活跃分析
                        时段分析
                    
                    
                        用户留存
                        流失用户
                    
                
            

由此我们根据iview的设定，单独编写一个子组件来作为基础模板。

子组件

接受一个parentItem的参数，用于父组件传参。

再编写一个父组件

父组件

ps：父组件调用子组件，根据数据判断是否拥有子级，进而走不同的流程

注意：根据数据动态的时候，不要忘记＋iview官网提供的更新菜单的方法。

this.$nextTick(() => {
	this.$refs.side_menu.updateOpened()
	this.$refs.side_menu.updateActiveName()
});

否则会引起部分bug。

 

关于menu的方法还可以与tab标签效果联动，控制展开选中状态。有时间在更。。。。。

这部分就，有时间再更了 。

前端小白，一点投机取巧的小干活，有问题的话，大佬请指出