public에 img 파일을 저장하자

김명성·2022년 2월 13일
0

REACT

목록 보기
22/32
post-custom-banner

import / export

파일을 나눌 때 사용한다

const name = 'Kim';

내보내기
export default name
여러개를 내보내려면 중괄호로 묶는다
export {name1, name2}
받아오기
import {name, name2} from './경로'

변수 그대로를 담아 사용할수도 있다.

export default [ { a: 1 }, { b: 2 }, { c: 3} ]

부트스트랩에서 제공하는 Carousel을 커스텀 하려고 하였는데 문제가 발생되었다.
Carousel.Item만을 이름이 다른 컴포넌트에 담아 반복문을 실행하려 하였는데
참조오류가 발생되었다.
Warning: Function components cannot be given refs.
Attempts to access this ref will fail. Did you mean to use React.forwardRef()?
Carousel.Item에 map 함수를 적용할 수는 있지만,
컴포넌트에 담는다면 이름이 다르기에 (Carousel.Item !== some component name)
적용 될 수 없었다.
컴포넌트를 삭제하고, 다시 App.js내에서 만들어 사용하려고 하였는데,
케러셀에 들어가는 이미지파일 경로에 오류가 발생하였다.
개발자도구에는 정상적으로 src/img/title1.jpg로 입력되지만 파일이 안보이는 상태

해결방법 : src가 아니라 public에 img 폴더를 이동하고 경로를 수정하니 정상적으로 출력되었다.

post-custom-banner

0개의 댓글