const [contentarr, setContentarr] = useState([
{ className: 'AAA', imgSrc: '/asset/heart1.svg', heartbtn: 0 },
{ className: 'BBB', imgSrc: '/asset/heart1.svg', heartbtn: 0 },
{ className: 'CCC', imgSrc: '/asset/heart1.svg', heartbtn: 0 },
{ className: 'DDD', imgSrc: '/asset/heart1.svg', heartbtn: 0 },
]);

const handleHeartClick = (index) => {
const updatedContentarr = contentarr.map((item, i) => {
if (i === index) {
return { ...item, heartbtn : 1};
}
return item;
});
setContentarr(updatedContentarr);
};




<div className="grid-item item3">
{contentarr.map((item, index) => (
<div
className={item.className} key ={index}
>
<img src={item.imgSrc}
onClick={() => {
handleHeartClick(index);
}}
className="heart1"
/>
{
item.heartbtn === 1 ? (<img src="/asset/heart2.svg" className="heart2" />) : null
}
</div>
))}
</div>




첫번째 사진에서 heartbtn 1로 바꾸는 작업에서 toggle 어떻게 만들어야할지 모르겠음