我正在为React使用一个可重用的组件，我试图在数组对象中映射数组，以进入这个组件. 数据看起来像:
export const portfolioData = [
{
title: "Drum Kit",
url: "some url",
codeUrl: "some github repo",
mobileFriendly: false,
img: "some img",
techUsed: ["React", "APIs", "Custom Hooks"],
},
];
该 map 如下所示:
<div>
{portfolioData.map((portfolio,i)=>(<PortfolioCard key={i}>{portfolio}</PortfolioCard> ))}
</div>
并且可重用组件如下所示:
<div>
<img src={img} />
<h3>{title}</h3>
<button target="_blank" href={url}><FaCode />
</button>
<button target="_blank" href={codeUrl}><CgWebsite />
</button>
<ul>
<li>{mobileFriendly}</li>
<li>{techUsed}</li>
</ul>
</div>
当我使用.map()时，它会识别出我已经映射了something多个，但它没有在屏幕上显示任何内容，只显示了三个空组件(我的数组中有三个对象).