使用 .map 并收到警告：道具类型失败：道具“to”在“链接”中标记为必需，但其值为“未定义”[关闭]

Question

我在打开导航栏时收到此警告 警告：失败的道具类型：道具to在Link中标记为必填，但其值为undefined。

我在这个项目中使用 material-ui 我正在使用 .map 来创建不同的链接

{menuItems.map((lsItem, key) => (
    <ListItem button key={key} component={Link} to={menuItems.listPath}>
       <ListItemIcon className={classes.listItem}>
          {lsItem.listIcon}
       </ListItemIcon>
       <ListItemText primary={lsItem.listText} className={classes.listItem} />
    </ListItem>
))};

这里是他们被拉出来的地方

const menuItems = [
    {
        listIcon: <Home />,
        listText: 'Home',
        listPath: '/'
    },
    ...
];

如果我对链接进行硬编码，我不会收到警告。 我包括to={...} 并且无法弄清楚为什么我会收到此警告，感谢您的任何意见！

Answer 1

将to={menuItems.listPath} 更改为to={lsItem.listPath}：

                {menuItems.map((lsItem, key) => (
                    <ListItem button key={key} component={Link} to={lsItem.listPath}>
                        <ListItemIcon className={classes.listItem}>
                            {lsItem.listIcon}
                        </ListItemIcon>
                        <ListItemText primary={lsItem.listText} className={classes.listItem} />
                    </ListItem>
                ))};