@sylvester
Чтобы создать компонент в React, вам нужно создать функцию или класс, которая возвращает разметку JSX (расширение языка JavaScript, которое позволяет использовать элементы HTML-подобной синтаксис внутри JavaScript).
Функциональный компонент может выглядеть следующим образом:
1 2 3 4 5 6 7 8 9 |
import React from 'react'; function MyComponent(props) { return ( <div> <h1>{props.message}</h1> </div> ); } |
Компонент, созданный с использованием класса, может выглядеть так:
1 2 3 4 5 6 7 8 9 10 11 |
import React from 'react'; class MyComponent extends React.Component { render() { return ( <div> <h1>{this.props.message}</h1> </div> ); } } |
Вы можете использовать созданный компонент, чтобы отобразить его в другом месте в вашем приложении, используя его имя, как элемент HTML:
1
|
<MyComponent message="Hello, world!" /> |
Как видите, создание компонента в React достаточно простое. Но это только начало – в React есть множество других функций и фич, ко
@sylvester
Для создания компонента в React.js нужно выполнить следующие шаги:
1
|
import React from 'react'; |
1 2 3 4 5 6 7 8 9 |
class MyComponent extends React.Component { render() { return ( // Код компонента ); } } |
1
|
export default MyComponent; |
1 2 3 4 5 6 7 8 9 10 |
import MyComponent from './MyComponent'; function App() { return ( // Код приложения ); } |
Готово! Вы создали и использовали компонент в React.js.