Menu.js

import React from 'react';

import styles from './index.less';

const Menu = props => {
  const renderTitle = title => <h4 className={styles.title}>{title}</h4>;
  const renderMenuItem = data => {
    let menuItem = [];
    if (!data) {
      return;
    }
    // eslint-disable-next-line no-prototype-builtins
    if (!data.hasOwnProperty('routes')) {
      menuItem = (
        <div
          className={styles['main-menus-recentAll-menu-group-items-menu-item']}
          onClick={event => props.handleClick(event, data)}
        >
          <img src={data.extData.icon} alt="" />
          <a
            className={`${
              styles['main-menus-recentAll-menu-group-items-menu-item-name']
            } ${styles.pad}`}
          >
            {data.name}
          </a>
        </div>
      );
    } else {
      data.routes.forEach((item, index) => {
        const render = (
          <div
            className={
              styles['main-menus-recentAll-menu-group-items-menu-item']
            }
            key={item.name}
            onClick={event => props.handleClick(event, item)}
          >
            <img src={item.extData.icon} alt="" />
            <a
              className={`${
                styles['main-menus-recentAll-menu-group-items-menu-item-name']
              } ${styles.pad}`}
            >
              {item.name}
            </a>
          </div>
        );
        menuItem.push(render);
      });
    }

    // eslint-disable-next-line consistent-return
    return menuItem;
  };
  return (
    <div className={styles['main-menus']}>
      <div className={styles['main-menus-recentAll']}>
        <div className={styles['main-menus-recentAll-menu-group']}>
          {(props.data.routes || []).map((item, index) => (
            <div
              className={styles['main-menus-recentAll-menu-group-items']}
              key={item.name}
            >
              {renderTitle(item.name)}
              {renderMenuItem(item)}
            </div>
          ))}
        </div>
      </div>
    </div>
  );
};

export default Menu;