I am getting TypeError: Cannot read properties of undefined (reading '0') when I'm trying to access the data that I've pulled from my database (receivedData which is an object). I've tried console.log my receivedData and it does have data in it. Here's how my social structure looks like where it is one of the keys of my receivedData object.
const logoObj = {
"telegram": telegramWIcon,
"twitter": twitterWIcon,
"website": linkWIcon,
"whitepaper": fileWIcon
}
{receivedData.social[0] !== null &&
<div>
{ Object.entries(receivedData.social[0]).forEach((item) =>
item[1] !== null ? <SocialMedia url={logoObj.item[0]} link={item[1]} /> : ""
)}
</div>
}
There is no item field in logoObj. You need to access the key dynamically with logoObj[item].
const logoObj = {
"telegram": telegramWIcon,
"twitter": twitterWIcon,
"website": linkWIcon,
"whitepaper": fileWIcon
}
{receivedData.social[0] !== null &&
<div>
{ Object.entries(receivedData.social[0]).forEach((item) =>
item[1] !== null ? <SocialMedia url={logoObj[item][0]} link={item[1]} /> : ""
)}
</div>
}const logoObj = {
telegram: telegramWIcon,
twitter: twitterWIcon,
website: linkWIcon,
whitepaper: fileWIcon,
};
{receivedData.social[0] !== null && (
<div>
{Object.entries(receivedData.social[0]).map(([type, link]) => {
if (!link || !logoObj[type]) {
returt null;
}
return <SocialMedia key={link} link={link} url={type} />;
})}
</div>
)}