Sobes.tech
Junior

Mi az a state és a props a React fejlesztésében?

sobes.tech MI

Válasz az MI-től

State — a komponens belső állapota, egy adathalmaz, amely a komponens működése során változhat. A state módosítása újrarenderelést eredményez.

Props — külső paraméterek, amelyeket a komponensnek kívülről, az ős-komponenstől adnak át. A props változatlanok a fogadó komponensen belül. Konfigurációra és adatátvitelre használják az ős- és gyermekkomponensek között.

Főbb különbségek:

Jellemző State Props
Forrás Belső komponens Kívülről átadott
Változtathatóság Változhat Nem módosítható a belsejében
Cél Belső megjelenés irányítása Adatok és konfiguráció átadása

State használatának példája:

import React, { useState } from 'react';

function Counter() {
  const [count, setCount] = useState(0); // State inicializálása

  return (
    <div>
      <p>Számláló: {count}</p>
      <button onClick={() => setCount(count + 1)}>Növel</button>
    </div>
  );
}

Props használatának példája:

import React from 'react';

function Greeting(props) {
  return <h1>Helló, {props.name}!</h1>; // Props használata
}

function App() {
  return <Greeting name="Világ" />; // Props átadása
}