vue手写三级分类折叠展开

这是视图层：

    

                

                    
                    

                        

                            {{item.catename}}
                            

                                {{item.enabled_text}}
                            
                        
 
                    
                    
                    

                        

                            {{item.expanded?'► ':'▼ '}}{{item.catename}}
                            

                                {{item.enabled_text}}
                               
                        
                        

                            

                                
                                
{{child.catename}}
                                    

                                        {{child.enabled_text}}
                                    
                                
                                
                                

                                    

                                        {{child.expanded?'► ':'▼'}}{{child.catename}}
                                        

                                            {{child.enabled_text}}
                                        
                                    

                                    

                                        
                                        

                                            

                                                {{child1.catename}}
                                                

                                                    {{child1.enabled_text}}
                                                
                                            
                                        
                                    
                                
                            
                        
                    

                
            

这是逻辑层：
模拟数据(data里的数据)：

  menulist:[{
                catename:'水果',
                expanded:false,
                _child:[{
                    catename:'苹果',
                    },{
                    catename:'荔枝'
                    },{
                    catename:'葡萄'
                    },{
                    catename:'火龙果',
                    expanded:false,
                    _child:[
                        {
                        catename:'白心',
                        },{
                        catename:'红心'
                        },
                    ]

                }]
            }]

下面是切换的函数：

// 切换展开收起
        toggleChildren: function(item) {
            // console.log(item)
            item.expanded = !item.expanded;
        },