LayoutSlide.js 1.59 KB
import React,{Component} from 'react'
import { Menu, Icon } from 'antd';
import {Link,withRouter} from "react-router-dom";
import { TransitionGroup, CSSTransition } from "react-transition-group";
const { SubMenu } = Menu;



export default class LayoutSlide extends Component{
    state={
        defaultSelectedKeys:[0],
        defaultOpenKeys:[0],
        
        MenuList:[
        {title:"test1",children:[
            { title:"test1-1",path:"/index"}, { title:"test1-2",path:"/index2"},{ title:"test1-3",path:"/"}
        ]},
        {title:"test1",children:[
            { title:"test1-1",path:"/index"},{ title:"test1-2",path:"/index2"},{ title:"test1-3",path:"/"}
        ]}
        ]
    }
    componentWillMount(){
        console.log("slides",this.props);
    }
    render(){
        let {defaultSelectedKeys,defaultOpenKeys,MenuList} =this.state;
        return  <Menu
        mode="inline"
        defaultSelectedKeys={defaultSelectedKeys}
        defaultOpenKeys={defaultOpenKeys}
        style={{ height:"100%" }}
      >
       {    
           MenuList.map((item,ind)=>{
       return <SubMenu key={'SubMenu_'+ind} title={<p><Icon type="mail" /><span>{item.title}</span></p>}>
                        {
                            item['children']&&item['children'].map((el,cind)=>{
                            return <Menu.Item key={'MenuItem_'+cind}><Link to={el.path}>{el.title}</Link></Menu.Item>
                            })
                        }
                            
                    </SubMenu>
           })
        }
       
        
      </Menu>
      
                        
    }
}