• 로그인
  • 장바구니에 상품이 없습니다.

home2 게시판 React 게시판 쇼핑몰 만들기 질문있습니다!

쇼핑몰 만들기 질문있습니다!

5 글 보임 - 1 에서 5 까지 (총 5 중에서)
  • 글쓴이
  • #54446

    홍승진
    참가자
    안녕하세요 선생님.
    리액트 강의 수강하고 쇼핑몰 사이트에 살을 더 붙여서 만들고 있는데요.
    
    /pants, /shirts, /shoes 의 경로를 갖는 라우트 들에서 각각의 상품목록을 ajax로 
    가져와서 보여주고 특정 상품을 클릭하면 해당 상품의 데이터를 리덕스 스토어에 객체로 저장한 뒤 
    /detail 페이지로 이동해서 해당 값을 보여주도록 코드를 짰습니다. 
    그런데 이러면 사용자가 /detail url로 먼저 진입했을 때 상품 데이터를 가져올 수가 없더라구요.  
    
    강의에선 App.js에 사이트 맨 처음에 전체 데이터를 가져와 state에 저장하고 
    detail/:id 라우트 컴포넌트에 props로 넘겨 클릭한 데이터를 찾아 보여주도록 하셨는데요
    그럼 저도 App.js에서 pants, shirts, shoes 같은 데이터들을 모두 가져와 state에 먼저 저장해두고 쓰는 수 밖에 없을까요?
    
    상품목록은 JSON 배열형식으로 임의로 만들어서 깃허브에 올린 뒤 ajax로 가져오고 있습니다.
    
    #54491

    codingapple
    키 마스터
    아니면 /detail페이지 로드시에도 데이터 ajax요청하라고 코드짜놔도 될듯요
    #54527

    홍승진
    참가자
    그럼 /pants 에서 04 상품 클릭했을 때 
    1.해당 상품 데이터를 활용해
    detail/pants_04 페이지로 이동
    
    2.페이지 로드시 useParams 로 url의 "pants_04" 를 가져옴
    
    3.pants_04를 각각 변수에 cate = "pants" 와 id = 04 로 나눠 각각 저장,
    
    4. ajax 요청 url (`어쩌구~${cate})
    
    5.요청한 데이터에서 id에 해당하는 상품을 찾아 화면에 보여줌
    
    이런식으로 하면 될까요? 2,3번이 과연 저게 최선인가 싶긴합니다..ㅜ
    
    
    
    
    
    #54589

    codingapple
    키 마스터
    넴 detail/pants/4 이렇게 해두는게 url 가져올 때 쉽습니다
    #54606

    홍승진
    참가자
    감사합니다~!
5 글 보임 - 1 에서 5 까지 (총 5 중에서)
  • 답변은 로그인 후 가능합니다.

About

현재 월 700명 신규수강중입니다.

  (09:00~20:00) 빠른 상담은 카톡 플러스친구 코딩애플 (링크)
  admin@codingapple.com
  이용약관
ⓒ Codingapple, 강의 예제, 영상 복제 금지
top

© Codingapple, All rights reserved. 슈퍼로켓 에듀케이션 / 서울특별시 강동구 고덕로 19길 30 / 사업자등록번호 : 212-26-14752 온라인 교육학원업 / 통신판매업신고번호 : 제 2017-서울강동-0002 호 / 개인정보관리자 : 박종흠