More than 3 years have passed since last update.

React入門（import, export）

Posted at 2021-03-17

import, export

Hello Reactを表示するようまでをまとめています。
下の表示がディレクトリの構成です。

├── src
│   ├── App.js
│   ├── contexts
│   │   └── hello.js

App.js

import { Hello } from './contexts/hello.js';

function App() {
  return (
    <Hello />
  );
}

import { Hello } from './contexts/hello.js';
App.jsでHello関数を呼び出してretunでHello関数を表示しています。

hello.js

export const Hello = () => {
  return (
    <div>Hello React</div>
  )
}

hello.jsはexportでHello関数を他のファイルでも使えるように設定しています。