'index. Js'
Import the React from 'React'
The import {Menu, Icon} from 'antd';
The import menuList from '../../../config/menuConfig '
The import './index. Less '

The import Item from 'antd/lib/list/Item';
Const SubMenu=Menu. SubMenu;



Export the default class NevLeft extends ponent {
React.ComStste={
RootSubmenuKeys: [],
OpenKeys: [],
};
ComponentWillMount () {
Const menuTreeNode=this. RenderMenu (menuList);
Enclosing setState ({
MenuTreeNode
})
}
//rendering menu
RenderMenu=(data)=& gt; {
Return the data. The map ((item)=& gt; {
If (item. Children) {
Return (
{this. RenderMenu (item. Children)}


)
}

Return & lt; Menu. The Item title={Item. The title} key={Item. Key} & gt; {item. The title} & lt;/Menu. Item>
})

}

Render () {
Return (

);
}
}

'common. Less'
The container {

. Nev - left {
Background: color # 001529; ;
color: #ffffff;

Height: calc (100 vh);


}
. The main {

Height: calc (100 vh);
}
. The content {
position: relative;
Padding: 20 px;
}
}



menuconfig. Js
Const menuList=[
{
Title: 'front page',
Key: "/admin/home '
},
{
Title: 'UI',
Key: '/admin/UI,
Children:
{
Title: 'button,
Key: 'buttons/admin/UI/',
},
{
Title: 'bounced,
Key: '/admin/UI/modals,
},
{
Title: 'Loading',
Key: '/admin/UI/loadings,
},
{
Title: 'notifications',
Key: '/admin/UI/notification',
},
{
Title: 'global Message',
Key: '/admin/UI/messages',
},
{
Title: 'Tab Tab,
Key: '/admin/UI/tabs',
},
{
Title: 'photo gallery',
Key: '/admin/UI/gallery,
},
{
Title: 'round figure',
Key: '/admin/UI/carousel,
}
]
},
{
Title: 'form',
Key: '/admin/form,
Children:
{
Title: 'login',
Key: '/admin/form/login',
},
{
Title: 'registered',
Key: '/admin/form/reg',
}
]
},
{
Title: 'form',
Key: '/admin/table,
Children:
{
Title: 'basic form,
Key: '/admin/table/basic',
},
{
Title: 'senior form',
Key: '/admin/table/high',
}
]
},
{
Title: 'rich text,
Key: '/admin/rich'
},
{
Title: 'urban management,
Key: '/admin/city'
},
{
Title: 'the order management,
Key: '/admin/order,
BtnList: [
{
Title: 'order details',
Key: 'detail'
},
{
Title: 'end orders',
Key: 'finish'
}
]
},
{
Title: 'staff management,
Key: "/admin/user '
},
{
Title: 'vehicle map',
Key: '/admin/bikeMap'
},
{
Title: 'icon',
Key: '/admin/charts,
Children:
{
Title: 'bar charts,
Key: '/admin/charts/bar'
},
{
Title: 'pie',
Key: '/admin/charts/pie'
},
{
Title: 'line chart,
Key: '/admin/charts/line'
},
]
},
{
Title: 'permissions',
Key: '/admin/permission'
},
];
Export the default menuList;

CodePudding user response:

Then there is no error

CodePudding user response:

Actual to if the inside have me the config below the menu bar on the left of all the options