1

Use React `children` with another name

Is it possible to set a name for children in react for better code readability?
I want something like this:

default function LinksBar({ links = children }) {
    return (
        <div>
            {links} {/* instead of {children} */}
        </div>
    )
};

I know I can pass them in props, but I don't want to do it this way (just because of personal preference).

I don't want this:

<LinksBar links={<><Link href="1" /><Link href="2" /><>} />

I want this:

<LinksBar>
    <Link href="1" />
    <Link href="2" />
<LinksBar/>

Submitted September 30th 2021 by Admin

Answers
0

You can alias it, although React speaking, it's less readable, in my opinion:

function LinksBar({ children: links })

Admin | 2 weeks ago



Relevant Questions