Next.js Discord

Discord Forum

[object Object] error on Array.map

Unanswered
Cape lion posted this in #help-forum
Open in Discord
Cape lionOP
{c.length === 0 ? (
                    <p className="mt-6 animate-fade-up text-center text-gray-500 opacity-0 [text-wrap:balance] md:text-xl" style={{ animationDelay: "0.25s", animationFillMode: "forwards" }}>
                        Veri bulunamadı.
                    </p>
                ) : (
                    <>
                        <p className="mt-6 animate-fade-up text-center text-gray-500 opacity-0 [text-wrap:balance] md:text-xl" style={{ animationDelay: "0.25s", animationFillMode: "forwards" }}>
                            <span className="font-bold">Firmalar:</span> {c.map((item) => {
                                return (
                                    <Link key={item.id} className="font-bold" href={`firmalar/${item.id}`}>{item.name}</Link>
                                );
                            }).join(", ")}
                        </p>
                    </>
                )}

There is my code and i get Firmalar: [object Object], [object Object]. How can i fix that? Also c.map gives correct informations.

1 Reply

You can’t just join them, JSX elements are objects and it’s converted to a string when you are joining them with the Array.map method.

You can place it inside a fragment like
<Fragment key={item.id}>
  <Link … />
  {i < items.length - 1? “,” : null}
</Fragment>