Как создать компонентв в React.js?

@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 есть множество других функций и фич, ко