То, что отображается с помощью реакции, — это компонент приложения, разбитый на 4 компонента.
Компоненты могут быть дублированы, например. Сиденьев может быть 2, по одному с каждой стороны. Компоненты представляют собой файлы .js двух возможных типов.
Функциональные компоненты без сохранения состояния — это функции js, которые запускаются при рендеринге композиции. Компонент класса с состоянием имеет метод рендеринга, который запускается при рендеринге компонента. О том, как выбрать, поговорим позже.
App.js — это компонент класса с отслеживанием состояния. Он имеет класс «Приложение», который расширяет класс «компонент».
Вводит свойства (реквизиты) и выводит HTML (он же JSX) для отображения.
Теперь мы будем отображать с помощью функции comp. Перейдите в app.js и удалите все внутри тега ‹div›.
Внутри папки src создайте папку с именем component. Внутри этого создайте файл Greet.js (случай Pascal)
На изображении ниже показано размещение файла Greet.js в менеджере проектов.
Другой способ написания функции компонента — метод ES6:
export const Greet = () =› ‹hi›Привет, Эклавья!‹h1›
Точно так же в папке компонентов создайте файл Welcome.js. В файле:
Нам нужно импортировать две вещи: React из «React» и класс Component из «React». Затем класс определяется с помощью метода рендеринга. Этот класс должен расширить класс Component от «реакции», импортированной в объявлении. В функции рендеринга напишите возвращаемый HTML. ИМПОРТ и ЭКСПОРТ должны быть написаны одинаково.
