2.2 KiB
title, localeTitle
| title | localeTitle |
|---|---|
| Write a React Component from Scratch | Напишите компонент реакции с нуля |
Напишите компонент реакции с нуля
В этой задаче мы хотим создать компонент реагирования class (компоненты React могут быть компонентами class или function компонентами). Все наши компоненты класса будут расширением React.Component . Например, мы можем начать составлять компонент FirstComponent с:
class FirstComponent extends React.Component {
};
Мы также должны обязательно определить constructor для нашего нового класса. Это лучшая практика для вызова любого компонента constructor с super и передать props для обоих. super вытягивает constructor родительского класса нашего компонента (в данном случае React.Component ). Теперь код для нашего компонента выглядит следующим образом:
class FirstComponent extends React.Component {
constructor(props) {
super(props);
}
};
Теперь все, что осталось сделать, это определить, что наш компонент будет render ! Мы делаем это, вызывая метод render компонента и возвращаем наш код JSX:
class FirstComponent extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
// The JSX code you put here is what your component will render
);
}
};
Как только ваш код JSX находится там, ваш компонент завершен! Если вы хотите более подробный учебник по компонентам React, Samer Buna написал отличную статью .