inflearn logo
강의

講義

知識共有

イメージ管理フルスタック (feat. Node.js、React、MongoDB、AWS)

Context APIを活用して中央データを管理する

ImageList 컴포넌트에서 업로드 한 사진을 리스트에서 바로 보기 위해 이 방법도 괜찮나요??

377

Jiwoo Jung

投稿した質問数 3

0

ImageList 컴포넌트 안에 있는 useEffect 종속배열 안에 images를 넣게 되면 images가 변경될 때마다 get을 호출해서 사진을 불러오기 때문에 결과적으로 사진을 업로드하면 리스트에 바로 보여지긴 하는데 안 좋은 방법인가요?

선생님께서 ContextAPI를 사용해 관리하는 것과 제가 생각한 방법의 장단점이 궁금해요

 const [images, setImages] = useState([]);

  useEffect(() => {
    axios
      .get("/images")
      .then((res) => setImages(res.data))
      .catch((err) => console.log(err));
  }, [images]); // images 추가!

react node.js aws mongodb express lambda

回答 1

0

sihoon

흠 저렇게 하면 UploadForm 컴퍼넌트가 이미지 업러드 이후 setImages 호출을 못하지 않나요? context로 분리한 이유는 서로 다른 컴퍼넌트에서 접속할 수 있게 하기위해서입니다. 사실상 동일한 방법으로는 그냥 저 상태를 사용하는 모든 자식 컴퍼넌트들의 부모 컴퍼넌트에 const [images, setImages] = useState([]); 를 정의하시고 props로 내려주셔도 되고요.

Router.use 두번째 파라미터 ImageRouter : undefined 전달 오류

0

107

2

소스코드 요청

0

153

1

프록시 관련 질문

0

151

1

Presigned URL 사용시 데이터베이스 저장 시점

0

322

1

이미지 등록시 자동 등록 오류

0

211

1

강의에 사용된 코드 다운 받는 사이트 주소 있나요?

0

373

2

axios 이용해서 백엔드로 이미지 전송 중 새로고침

0

471

1

이미지 처음 올릴 때만 나타나는 오류

0

250

1

es6 스타일로 Import 할때 동작하지 않습니다.

0

382

1

이미지 업로드시

0

359

1

node js를 이용하고 mysql에 이미지 경로 저장

2

1258

1

선생님 cloudFront를 사용하게되면 S3는 private으로 사용하는게 좋을까요

0

539

1

선생님 aws-sdk 모듈을 찾을 수 없다고 합니다.

0

663

1

new aws.S3 version 확인

2

506

1

react-router-dom v6 useHistory 이슈

7

636

0

람다에서 시간 초과 에러가 뜹니다!

0

315

1

첫 로드시 동일한 이미지 두번호출

2

485

1

이미지 업로드 시 배열로

2

524

1

Promise.all에 대한 질문

0

421

1

세션에 관한 질문이 있습니다.

0

428

1

Promise.all관련 질문 ("여러 이미지 미리보기" 중...)

0

303

1

cdn 주소

0

502

1

특정 user 페이지 가져오기 질문있습니다.

0

289

1

mime-types에서 jpg타입 저장이 안됩니다.

0

414

2