Կոմպոնենտների օգտագործումը React-ում

Յուրաքանչյուր միացված կոմպոնենտ ունի իր համապատասխան JSX թեգը: Օրինակ, մենք ունենք Product կոմպոնենտ, ինչը նշանակում է, որ դրան համապատասխանում է հետևյալ թեգը:

<Product />

Կոմպոնենտի թեգի անվանումը պարտադիր պետք է գրվի մեծատառով, որպեսզի React-ը կարողանա տարբերակել կոմպոնենտի կանչը HTML թեգի օգտագործումից:

Այսպիսով, եկեք App կոմպոնենտի ներսում օգտագործենք Product կոմպոնենտը՝ գրելով դրան համապատասխան թեգը.

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

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

export default App;

Արդյունքում, ռենդերինգից հետո կստացվի հետևյալը.

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

Ստեղծեք User կոմպոնենտը, որը կարտածի օգտատերերի տվյալները: Թող առայժմ այս կոմպոնենտը պարզապես արտածի ինչ-որ տեքստ: Օգտագործեք այս կոմպոնենտը App կոմպոնենտում: