react map 双重循环 嵌套循环

实现效果：

如图，数据是模拟后台输出的json，通过双重循环将数据放到侧边栏中

json数据如下

{
	"items":[
	{
		"item": "BeJson",
		"menuItem": ["menu1","menu2","menu3"]
	},
	{
		"item": "mary",
		"menuItem": ["menu1","menu2","menu3"]
	},
	{
		"item": "even",
		"menuItem": ["menu1","menu2","menu3"]
	}
	]
}

侧边栏组件如下

import React, { Component } from 'react';
import { Menu, Icon,Switch } from 'antd';
import data from './slidedata.json';
const list = data.items; 
const SubMenu = Menu.SubMenu;
class Slider extends Component{
    state = {
        theme: 'dark',
        current: '0',
      }
    
      changeTheme = (value) => {
        this.setState({
          theme: value ? 'dark' : 'light',
        });
      }
    
      handleClick = (e) => {
        console.log('click ', e);
        this.setState({
          current: e.key,
        });
      }
    
      render() {
        return (
          <div>
            <Switch
              checked={this.state.theme === 'dark'}
              onChange={this.changeTheme}
              checkedChildren="Dark"
              unCheckedChildren="Light"
            />
            <br />
            <br />
            <Menu
              theme={this.state.theme}
              onClick={this.handleClick}
              style={{ width: 256 }}
              defaultOpenKeys={['sub1']}
              selectedKeys={[this.state.current]}
              mode="inline"
            >
            
              {
                  list.map(function(item,index){
                    return (
                        <SubMenu key={index} title={<span>{item.item}</span>}>
                        {
                             item.menuItem.map(function(item1,number){
                                 return (
                                     <Menu.Item key={number} id={number}>{item1}</Menu.Item>
                                 );
                            })
                        }
                        </SubMenu> 
                    );
                  }
                )
              }
            </Menu>
          </div>
        );
      }
}
export default Slider;