კომპონენტების გამოყენება 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.