Logo

Developer learning path

React

Props в React

Props

11

#description

Props – это сокращение от слова properties, что означает свойства. В React это атрибуты, которые передаются компоненту и используются для его настройки и/или рендеринга.

Props являются неизменяемыми (immutable), то есть после их задания в компоненте они не могут быть изменены самим компонентом. Однако, родительский компонент, передающий Props, может изменять данные и передавать их дочернему компоненту при каждом обновлении.

Props передаются с помощью атрибутов компонента в JSX:

                    
<ParentComponent>
  <ChildComponent name="John" age={25} />
</ParentComponent>
                  

В данном примере компонент ParentComponent является родительским, а ChildComponent – дочерним. Внутри ChildComponent мы передаем два свойства: name со значением "John" и age со значением 25.

В самом компоненте ChildComponent, мы можем получить эти данные и использовать их в рендеринге:

                    
function ChildComponent(props) {
  return (
    <div>
      <p>Name: {props.name}</p>
      <p>Age: {props.age}</p>
    </div>
  );
}
                  

В данном примере мы использовали функциональный компонент для ChildComponent. В нем мы создали новую переменную props, которая содержит переданные значения свойств. Затем мы использовали эти свойства в рендеринге.

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

March 25, 2023

Если вам не совсем понятен какой-то абзац текста из лекции, просто нажмите на него и сможете задать уточняющие вопросы по нему.

Если же непонятен весь вопрос, то нажмите на кнопки внизу, чтобы получить новый вариант объяснения, практические примеры или критически оценить сам вопрос.