Composizione Componenti
I componenti possono far riferimento anche ad altri componenti nel loro output.Per esempio, possiamo creare un componente
App
Ciao
function Ciao(props) {
return <h1>Ciao, {props.nome}</h1>;
}
function App() {
return (
<div>
<Ciao nome="Sara" />
<Ciao nome="Cahal" />
<Ciao nome="Edite" />
</div>
);
}
ReactDOM.render(
<App />,
document.getElementById('root')
);
function Ciao(props) {
return <h1>Ciao, {props.nome}</h1>;
}
function App() {
return (
<div>
<Ciao nome="Sara" />
<Ciao nome="Cahal" />
<Ciao nome="Edite" />
</div>
);
}
ReactDOM.render(
<App />,
document.getElementById('root')
);
function Ciao(props) { return <h1>Ciao, {props.nome}</h1>; } function App() { return ( <div> <Ciao nome="Sara" /> <Ciao nome="Cahal" /> <Ciao nome="Edite" /> </div> ); } ReactDOM.render( <App />, document.getElementById('root') );
E’ buona norma suddividere i componenti in componenti più piccoli, ove possibile. Questo rende i componenti più facili da gestire e riutilizzabili.
Nota Bene: i componenti React non devono mai modificare le proprie props. Le props devono essere in sola lettura e sono utilizzate per scambiare dati tra componenti.