antd循环输出

import React, {Component} from "react";
import { Menu, Icon } from 'antd';
import navCfg from "../../navCfg";

const SubMenu = Menu.SubMenu;

class RightMenu extends Component {

    constructor(props, context) {
        super(props, context);
        this.state = {
            current: '1',
            openKeys: [],
        };
        this.handleClick = this.handleClick.bind(this);
        this.onToggle = this.onToggle.bind(this);
    }
    handleClick(e) {
        this.setState({
            current: e.key,
            openKeys: e.keyPath.slice(1),
        });
    }
    onToggle(info) {
        this.setState({
            openKeys: info.open ? info.keyPath : info.keyPath.slice(1),
        });
    }

    render() {

        return (
            <div>
                <link rel="stylesheet" type="text/css" href="./src/component/public/rightMenu/rightMenu.css" />
                
                <Menu 
                    onClick={this.handleClick}
                    openKeys={this.state.openKeys}
                    onOpen={this.onToggle}
                    onClose={this.onToggle}
                    selectedKeys={[this.state.current]}
                    mode="inline"
                    className="rightMenuBlock"
                    onTitleClick=""
                    >
                    
                    {
                        navCfg.map((o, i) => {

                            if (o.sub === undefined) {
                                return (
                                    <SubMenu key={i} title={<span><span>{o.linkName}</span></span>}>

                                    </SubMenu> 
                                )
                                
                            }
                            return (
                                <SubMenu key={i} title={<span><span>{o.sub[0].linkName}</span></span>}>
                                    {
                                        o.sub.map((j, k) => {
                                            return (
                                                <Menu.Item key={k}>{j.linkName}</Menu.Item>
                                            )
                                        })
                                    }
                                </SubMenu>
                            )
                        })
                    }


                </Menu>

            </div>
        );
    }
}

export default RightMenu







/*
<Menu onClick={this.handleClick}
    openKeys={this.state.openKeys}
    onOpen={this.onToggle}
    onClose={this.onToggle}
    selectedKeys={[this.state.current]}
    mode="inline"
    className="rightMenuBlock"
    onTitleClick="">
    <SubMenu key="sub1" title={<span><Icon type="mail" /><span>导航一</span></span>}>
        <Menu.Item key="1">选项1</Menu.Item>
        <Menu.Item key="2">选项2</Menu.Item>
        <Menu.Item key="3">选项3</Menu.Item>
        <Menu.Item key="4">选项4</Menu.Item>
    </SubMenu>
    <SubMenu key="sub2" title={<span><Icon type="appstore" /><span>导航二</span></span>}>
        <Menu.Item key="5">选项5</Menu.Item>
        <Menu.Item key="6">选项6</Menu.Item>
        <SubMenu key="sub3" title="三级导航">
            <Menu.Item key="7">选项7</Menu.Item>
            <Menu.Item key="8">选项8</Menu.Item>
        </SubMenu>
    </SubMenu>
    <SubMenu key="sub4" title={<span><Icon type="setting" /><span>导航三</span></span>}>
        <Menu.Item key="9">选项9</Menu.Item>
        <Menu.Item key="10">选项10</Menu.Item>
        <Menu.Item key="11">选项11</Menu.Item>
        <Menu.Item key="12">选项12</Menu.Item>
    </SubMenu>
</Menu>
*/