如何解决“列表中的每个孩子都应该有一个独特的“关键”道具”警告不会消失
据我所知,我正在传递一个唯一密钥://我似乎仍然无法摆脱警告我添加一个唯一密钥的警告。我已经尝试过通过索引和project.name进行尝试,但是没有运气!
const Portfolio = () => {
const [projects,setProjects] = useState([
{
id: 1,name: 'Portfolio',description:
"The site you're on right now! You can view the source code on github.",tech: ['React','HTML','CSS','Netlify'],live: 'https://arrantate.netlify.com/',code: 'https://github.com/arrantate/portfolio',img: portfolioIMG,},{
id: 2,name: 'Weather App',description:
'Gives you the current weather and some brief information about a city of your choice',tech: ['Python','Flask','API calls','Bootstrap','HTML'],live: null,code: 'https://github.com/arrantate/weather-app',img: weatherAppIMG,]);
return (
<div className='container'>
<h1>Portfolio</h1>
{projects.map((project) => {
return <Project key={project.id} project={project} />;
})}
</div>
);
};
解决方法
<div className='container'>
<h1>Portfolio</h1>
{
projects.map((project,index) => {
return (
<div key={"_key"+index}>
<Project project={project} />;
</div>
);
})
}
</div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。