Používanie komponentov v Reacte

Každému pripojenému komponentu zodpovedá jeho vlastný JSX tag. Napríklad, máme komponent Product, čo znamená, že mu zodpovedá nasledujúci tag:

jsx<Product />

Názov tagu komponentu sa musí písať s veľkým začiatočným písmenom, aby React vedel rozlíšiť volanie komponentu od použitia HTML tagu.

Takže, v komponente App použime komponent Product napísaním zodpovedajúceho tagu:

jsximport React from 'react';
import Product from './Product';

function App() {
  return <div>
    <Product />
  </div>;
}

export default App;

Výsledkom po vykreslení bude nasledovné:

html<div>
  <p>
    product
  </p>
</div>