인프런 커뮤니티 질문&답변

뉸뉴

작성한 질문수

[리뉴얼] React로 NodeBird SNS 만들기

조인한 테이블에서 데이터 꺼내오기 질문

작성

253

안녕하세요 선생님. 현재 유저 프로필의 이미지를 불러오는데에 어려움을 겪고 있습니다...ㅠ

유저 정보는 유저 리듀서의 info안에 들어있으니 쉽게 꺼냈는데,

유저 Image는 다른 테이블(Images 테이블)에 들어있어서 어떻게 해당 아이디의 image의 src를 꺼내올 수 있는지 모르겠습니다..

저는 이렇게 가져오면 되지 않을까 싶었는데

me는 useSelector로 가져왔고,

리액트 노드버드에서 게시글 이미지를 조인된 테이블에서 `http://localhost:3065/${images[0].src}`이렇게 가져오길래(노드버드에서는 부모 컴포넌트에서 부터 props로 전달해서 준 것을 알지만 맥락이 제 코드와 비슷하다고 생각했습니다.)

하지만 리액트 노드버드에서는 게시글 이미지를 불러올 때 map의 키값으로 각각의 post의 id를 알 수 있지만 저는 바로 me를 불러오는데...어떻게 해야할지 감을 잡을 수 없어 질문 드립니다.ㅠ

조언 부탁드립니다 선생님.

express redux react nodejs Next.js

답변 1

제로초(조현영)

지식공유자

me 정보를 서버에서 불러올 때 Images를 include 안 하신 게 아닌가요??

뉸뉴

질문자

네....선생님 말씀대로 include에서 이미지 테이블을 빼먹었습니다....ㅠㅠㅠㅠㅠ제가 놓친 부분 이네요...

그리고 이상하게 이전 질문에서 routes의 user의 add.Image에서 오류가 나서, 선생님이 create부분에서 UserId를 설정하라 하셔서 설정해가지고 그 부분 오류는 해결했었는데 갑자기 또 add.Image가 함수가 아니라고 오류가 납니다..UserId를 설정했는데도요.

//프로필 정보 수정
router.patch('/info', isLoggedIn, upload.none(), async(req, res, next) => {
    try{
       const user = await User.update({
            info: req.body.info
        }, {
           where: {
            id: req.user.id
          } 
        });
        if(req.body.image){
          console.log('image:::' + req.body.image);
          console.log('user:::' + req.user.id);
          const image = await Image.create({src: req.body.image, UserId: req.user.id});
          await user.addImage(image);
        }
        res.status(200).json({info: req.body.info});
    }
    catch(error){
        console.error(error);
        next(error);
    }
});

오류가 난 부분은 이렇고,

Images테이블 구성은

위와 같이 되어있습니다.