Component(컴포넌트): 특정 코드 뭉치를 다른 부분에 이식하거나 재사용하기 위해 사용하는 코드 블록 단위를 말합니다.
Component를 파일 단위로 작성한 후 필요한 위치에서 임포트해 사용할 수 있습니다.
( 따라서 유지보수하기에 유리하겠죠 ? )
파일구조
예시로 src 폴더에 ImportComponent.js 파일을 생성한 후 다음과 같이 입력합니다.
return 된 html 코드를 render() 함수를 사용해 화면에 표시한다.
컴포넌트를 사용하기 위해선 ?
App.js 파일과 같은 경로에 위치한 ImportComponent.js 파일을 임포트 한 후 , 컴포넌트 명을 태그와 함께 사용하면 된다 .
결과는....
'리액트' 카테고리의 다른 글
| 리액트 생명주기 함수 componentDidMount() 사용하기 (0) | 2023.01.24 |
|---|---|
| 리액트 생명주기 함수 static getDerivedStateFromProps(props, state) 사용하기 (0) | 2023.01.24 |
| 리액트 생명주기 함수 constructor(props) 사용하기 (0) | 2023.01.17 |
| 리액트 생명주기 함수 render() 사용하기 (0) | 2023.01.17 |
| 개발 환경 준비 (node.js 14.4.0 version) (0) | 2023.01.17 |
