javascript / intermediate
Snippet
Prop Drilling vermeiden durch Komposition
Komponenten-Komposition ermöglicht es, Komponenten als Props zu übergeben (wie 'children' oder eigene Slots), wodurch Daten nicht durch mehrere Zwischenschichten gereicht werden müssen.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
const Layout = ({ children, sidebar }) => (<div className="container"><aside>{sidebar}</aside><main>{children}</main></div>);// Usage<Layout sidebar={<Navigation />}><DashboardContent /></Layout>
react
Erklärung
1
const Layout = ({ children, sidebar }) => (
Verwendet 'children' und 'sidebar' Slots für flexibles Rendering.
2
sidebar={<Navigation />}
Übergibt eine Komponente direkt in einen Slot statt tiefer Daten-Props.