Что такое state и props в контексте разработки на React?

Ответ от нейросети

sobes.tech AI

State — это внутреннее состояние компонента, набор данных, который может изменяться в процессе работы компонента. Изменение state приводит к перерисовке компонента.

Props — это внешние параметры, передаваемые компоненту извне, от родительского компонента. Props неизменяемы внутри компонента, который их принимает. Они используются для конфигурации и передачи данных от родителя к потомку.

Основные отличия:

Характеристика	State	Props
Источник	Внутреннее компонента	Передаются извне
Изменяемость	Может изменяться	Нельзя изменять внутри
Цель	Управление внутренним видом	Передача данных и конфигурация

Пример использования state:

import React, { useState } from 'react';

function Counter() {
  const [count, setCount] = useState(0); // Инициализация state

  return (
    <div>
      <p>Счетчик: {count}</p>
      <button onClick={() => setCount(count + 1)}>Увеличить</button>
    </div>
  );
}

Пример использования props:

import React from 'react';

function Greeting(props) {
  return <h1>Привет, {props.name}!</h1>; // Использование props
}

function App() {
  return <Greeting name="Мир" />; // Передача props
}

Предыдущий Следующий