Czym są propsy?

Ponowne używanie komponentu jest przydatne, ale trzy identyczne gwiazdki nie dają zbyt wiele możliwości. Props pozwalają przekazywać dane do komponentu, dzięki czemu każda kopia może być inna:

function Greeting({ name }) {
    return <p>Hello, {name}!</p>;
}

export default function App() {
    return (
        <div>
            <Greeting name="Ada" />
            <Greeting name="Alan" />
        </div>
    );
}

Tutaj dzieją się dwie rzeczy:

• Przekazywanie: propsy wyglądają jak atrybuty: name="Ada"
• Odbieranie: komponent rozpakowuje je na liście parametrów ({ name }) i używa ich w JSX jak każdej zmiennej

Ten sam komponent, inne dane, inny wynik: Hello, Ada! i Hello, Alan!. Właściwości (props) to sposób, w jaki komponenty nadrzędne konfigurują swoje komponenty potomne.