ant design 动态创建 Menu 菜单组件

数据如下

[
    { path:"/1",title:"meun1",icon:"book" },
    { path:"/2",title:"meun2",icon:"issues-close",
        children:[
          { title:"meun3",path:"/3",icon:"info-circle",children:[
              { title:"meun4",path:"/4",icon:"bars"},
              { title:"meun5",path:"/5",icon:"bars"},
              { title:"meun6",path:"/6",icon:"bars"},
              { title:"meun7",path:"/7",icon:"bars" }
            ] },
          { title:"meun8",path:"/8",icon:"branches",children:[
              { title:"meun9",path:"/9",icon:"bars" },
              { title:"meun10",path:"/10",icon:"bars" },
            ] },
          { title:"meun11",path:"/11",icon:"bars" },
          { title:"meun12",path:"/12",icon:"bars"},
        ]
     }
]

react 组件代码

import { Menu, Icon } from 'antd';
import { Link } from 'dva/router';
const SubMenu = Menu.SubMenu;

class Index extends PureComponent{

  static defaultProps = {
    menulist:[]
  }

  createMenu =  ((menuData)=>{  //创建菜单
    //let itemIndex = 0; //累计的每一项索引
    let submenuIndex = 0; //累计的每一项展开菜单索引
    let menu = [];
    const create = (menuData,el)=>{
      for(let i=0;i
                  {menuData[i].title}
                
              )}
            >
              {children}
            
          )
        }else{   //如果没有子级菜单
          //itemIndex++;
          el.push(
            
              
                {menuData[i].icon ?  : null}
                {menuData[i].title}
              
            
          )
        }
      }

    };

    create(menuData,menu);
    return menu;
  })(this.props.menulist);

  render(){
    return(
      
        {this.createMenu}
      
    )
  }
}

export default Index;