반응형
1. export: 내보내기
export default
export default는 어떤 파일의 코드를 타파일에서 사용하고 싶을 때 사용하는 코드로, 뒤에는 변수명이나, 함수가 들어갈 수 있다. 예로, 'mint coding'이 여러 곳에서 사용되어야 할 경우, 이를 name에 담아 export 해주면 그 어떤 파일에서도 간단히 name으로 해당 값을 넣어줄 수 있다.
const name = 'mint coding';
export default name;
export는 맨 마지막 줄에 위치하여, 한 파일에서 단 한번만 사용할 수 있다.
2. import 가져오기
import 작명 from './경로.js'; // .js를 생략해도 괜찮다.
import name from './경로.js'; // 꼭 name일 필요 없다. 원하는 대로 작명해도 괜찮다
3. 내보낼 변수/함수가 2개 이상일 경우
내보낼 변수/함수가 2개 이상일 경우에는, default를 삭제하고 중괄호{ } 안에 각 변수명을 넣어준다.
const name = 'mint coding';
const writer = 'cinnamon';
export { name, writer };
그리고 import 할 때, 작명이 아니라, export 할 때 작성했던 중괄호{ }안 문구를 동일하게 작성해줘야 한다.
import { name, writer } from './경로.js';
반응형
'React (old ver) > basic' 카테고리의 다른 글
React Router 리액트 라우터1 { Route, Switch } (0) | 2021.11.05 |
---|---|
data.js에 있는 데이터를 useState()에 담기. feat.map() (0) | 2021.10.30 |
input 입력값을 가져와, 기존 state에 추가해보자. (0) | 2021.10.30 |
map & props 응용편 (0) | 2021.10.30 |
props, 부모의 state를 가져와 보자. (0) | 2021.10.30 |
댓글