React компоненттеринде Props колдонуу

Тема: React компоненттеринде Props колдонуу

Иштин максаты

React компонентине маалыматты props аркылуу берүү принциптерин үйрөнүү.

Теориялык маалымат

Props — бул компонентке сырттан берилген маалымат. Props аркылуу компоненттер арасында маалымат алмашуу болот.

Иштин жүрүшү

  1. Student.jsx компонентин түзүү

function Student(props) {   return (     <div>       <h2>Студенттин аты: {props.name}</h2>       <p>Жашы: {props.age}</p>     </div>   ); } export default Student;

  1. App.jsx ичинде колдонуу

import Student from "./Student"; function App() {   return (     <div>       <Student name="Айбек" age="20" />       <Student name="Алина" age="21" />     </div>   ); } export default App;

Натыйжа

Экранда:

Студенттин аты: Айбек Жашы: 20 Студенттин аты: Алина Жашы: 21

Контролдук суроолор

  1. Props деген эмне?
  2. Props кантип компонентке берилет?
  3. Props өзгөртүлөбү?