Реагировать на список карт в функции, вернуть HTML-код - PullRequest
0 голосов
/ 07 декабря 2018

Я создаю свое меню приложения, и в моей функции возникает следующая ошибка:

У каждого дочернего элемента в массиве или итераторе должен быть уникальный «ключ» prop

function buildListItemWithNavLink(prop, key, activePro, listItemClasses, whiteFontClasses){
return (
  <div>
    <NavLink
      properties
    >
      <ListItem button className={classes.itemLink + listItemClasses}>
        <ListItemText
            properties
        />
      </ListItem>
    </NavLink>
    {prop.subMenus != null ? (
      prop.subMenus.map((propSubMenu, keySubMenu) => {
        if(propSubMenu.path != undefined)
          return buildListItemWithNavLink(propSubMenu, keySubMenu, activePro, listItemClasses, whiteFontClasses);
        else
          return buildListItemWithoutNavLink(propSubMenu, whiteFontClasses);
      })
    ) : null}
  </div>
);
}  

Моя операция вызывается в переменной:

var links = (
<List className={classes.list}>
  {routes.map((prop, key) => {
    if (prop.redirect) return null;
    var activePro = " ";
    var listItemClasses;
    listItemClasses = classNames({
      [" " + classes[color]]: activeRoute(prop.path)
    });

    const whiteFontClasses = classNames({
      [" " + classes.whiteFont]: activeRoute(prop.path)
    });

      return buildListItemWithNavLink(prop, key, activePro, listItemClasses, whiteFontClasses);
  })}
</List>
);

Я не понимаю проблемы.Моя цель - создать меню с подменю

...