Правильно ли я делаю импорт компоненты в React?

Изучаю React.

Рабочий код.

Пример компоненты, которую я буду импортировать.
MyComponent.jsx
import React from 'react';
const MyComponent = () =>
{
return (

<div className="MyComponent">
Содержимое компоненты, JSX код и т. д.
</div>

);
}

export default MyComponent;


Импортирую компоненту в главный файл.
App.jsx
import React from 'react';
import Header from './components/MyComponent';

const App = () => {

return (
<div className="App">
<div className="wrapper">
<MyComponent />
</div>
</div>
);

export default App;


Правильно ли я всё делаю? А именно:
1) import React from 'react'; в каждом файле с компонентой. А может, достаточно делать импорт только в одном?
В App.jsx, например? А так получается мы повторно вставляем лишний код.
В php для этого есть include_once - вставить содержимое только 1 раз.

2) Файл компоненты принято сохранять с расширением jsx? (MyComponent.jsx)
3) При подключении файла компоненты его принято писать без расширения?
(import Header from './components/MyComponent';)
  • Вопрос задан
  • 101 просмотр
Пригласить эксперта
Ответы на вопрос 1
Vertexis
@Vertexis
1) Недостаточно. Сам компонент требует самодостаточности по использованию в нем другим компонентов.
2) Можно и в js просто. Но в этом случае шаблоны придется строить через громоздкие функции. jsx это расширение позволяющее выстраивать шаблон компонента почти также как писать обычный html
3) Да
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы