Nav
import React from 'react';
import {
Menu } from 'antd'
// import './index.css';
// import 'antd/dist/antd.css';
const SubMenu = Menu.SubMenu
const menuData = [
{
key: '/home',
title: '首页'
},
{
key: '/user',
title: '用户管理',
children: [
{
key: '/user/channel',
title: '用户渠道管理'
},
{
key: '/user/potential',
title: '潜在用户管理'
},
]
},
{
key: '/order',
title: '订单管理',
children: [
{
key: '/order/train',
title: '火车票订单'
},
{
key: '/order/plane',
title: '飞机票订单'
},
]
}
]
export default class Nav extends React.PureComponent {
constructor(props) {
super(props)
this.state = {
menuList: null
}
}
renderMenuData = (data) => {
return data.map((item) => {
// console.log('item', item);
if(item.children) {
return(
<SubMenu key={
item.key} title={
item.title}>
{
this.renderMenuData(item.children)}
</SubMenu>
)
}
console.log('ggggg:',<Menu.Item key={
item.key}>{
item.title}</Menu.Item>)
return <Menu.Item key={
item.key}>{
item.title}</Menu.Item>
})
}
componentDidMount() {
const menuList = this.renderMenuData(menuData);
this.setState({
menuList});
}
render() {
return (
<div className='nav'>
<Menu theme="dark">
{
this.state.menuList}
{
/* <Menu.Item key="0">菜单项1</Menu.Item>
<Menu.Item key="1">菜单项2</Menu.Item>
<SubMenu key="sub1" title="子菜单">
<Menu.Item key="2">子菜单项1</Menu.Item>
<Menu.Item key="3">子菜单项2</Menu.Item>
</SubMenu> */}
</Menu>
</div>
)
}
}