使用.map并获得警告:失败的prop类型:prop ' to '被标记为需要在' Link '中，但它的值是' und

Question

当我打开导航栏时，我得到了这个警告Warning: Failed prop type: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>
))};