React
React(8) Component파일 분리하기
새발개발JA
2021. 1. 1. 19:39
반응형
Component를 파일로 분리해보자.
큰 규모의 프로젝트일 때 수백개의 Component 관리를 쉽게 할 수 있기 때문이다.
1. src에 컴포넌츠를 담을 components 폴더 만들기 & 그안에 각 컴포넌츠 이름으로 js파일 만들기
2. 컴포넌츠 클래스들을 각 파일에 담기
components 폴더의 하위 파일로 만들어 클래스 자체를 넣어놓는다.
- 맨위에 선언 → import React, {Component} from 'react';
- 맨아래에 선언 → export default Subject; (Subject 클래스를 외부에서 가져다 쓸 수 있도록 선언해준다.)
3. 상위 컴포넌츠에 import해서 맘껏 사용하기
상위 컴포넌츠인 App.js에서는 import Subject from "./components/Subject.js"; 선언후 사용한다.
실행화면
반응형