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

home2 게시판 React 게시판 파트2 Ajax 숙제풀이 / 버튼 컴포넌트로 만들기

파트2 Ajax 숙제풀이 / 버튼 컴포넌트로 만들기

  • 이 주제에는 5개 답변, 2명 참여가 있으며 codingapple4 년 전에 전에 마지막으로 업데이트했습니다.
6 글 보임 - 1 에서 6 까지 (총 6 중에서)
  • 글쓴이
  • #12767

    노재근
    참가자

    https://github.com/njg7194/Cafe24-demo/commit/9f79b70c7e551014757037a2520ad04c7e028c90

    커밋내용입니다!

     

    .App 리턴문 button테그 안 콜벡함수에 때려넣는거 거부감들어서 컴포넌트화 해보려구 했습니다.

    ..일단 되긴 되는데.. 코드 쓰고 저장한다음에 버튼 누르고 로드가 안되서 혹시나 하고 

    router쪽 신발 가져오는 리스트랑 버튼이랑 줄바꿈 하고..! 저장하니까 딱 바뀌긴 하는데..

    버튼 누른다고 재깍재깍 바뀌지는 않습니다.

     

    아 그리고 useEffect에서 뒤쪽에 []추가해서 실행 조건 제한하는 부분에서 한번 알림창이 꺼질때 반응은 하는데 왜 홈으로 가기에서도 반응하는지 궁금하고, 반응하지 않게 하려면 어떻게 해야하나요??

     

    정석으로 짜려면 어떻게 해야하나요..?  그리고 보통 불러오기 버튼 만든다고 했을때 이렇게 만들기도 하나요..?

    #12773

    codingapple
    키 마스터

    ajax 요청은 서버로부터 데이터 받아오는데 시간이 소요되니 바로 반영되진 않습니다

     

    html이 길면 컴포넌트 문법으로 축약하는게 맞고

    자바스크립트 코드만 긴건 함수문법으로 축약하는게 쉽습니다 

    코드를 자주 재사용한다면 함수로 만들어놓고 한번만 쓸거라면 그냥 쌩코딩 하면 되는데

    정석 그런건 없습니다 개발자 맘입니다 

     

    useEffect 뒤에 [] 이것만 채워넣으면 컴포넌트 등장시에도 실행되지만 소멸시에도 실행됩니다

    #12776

    노재근
    참가자

    답변 감사합니다.

    강의 들으면서 보니까 리엑트 신문법(?)으로 오면서 function키워드로 컴포넌트화 하는거때문에 함수문법으로 축약한다는 말씀이 조금 햇갈리는데,

    컴포넌트화 한다는건 함수명 첫글자를 대문자로 하고, return에 JSX를 써서 HTML축약으로 <Component />이런식으로 사용할 수 있게 만든다는 것이고

    함수형으로 쓴다는것은 그냥 메소드 작성하듯 사용하면 된다는 말씀이 맞나요?

    그리고 서버에서 불러오는 시간때문에 바로 적용이 되지 않는다면 딜레이를 조금 주는 방법이면 해결이 가능할까요?

    해보지 않고 질문부터 해서 죄송합니다

    #12784

    codingapple
    키 마스터

    1. 넴

    2. 넴 근데 딜레이를 왜 주는 것이죠

    #12795

    노재근
    참가자

    답변 감사합니다.

    첫번째 답변에서 서버에서 데이터를 받아오는 시간이 걸린다고 하셔서 딜레이를 추가하면 괜찮을까 싶어서 여쭤봤습니다.

    선생님 답변을 다시 보니 바로 반영되지는 않는다고 하신 걸 보아 조금 늦게라도 데이터가 받아와 지면 업데이트 자동으로 되는것이라고 말씀하신 것 같습니다.

    저도 map()함수로 당연히 자동으로 업데이트 될 것이라고 생각했는데 첫 질문에서 말씀 드린 것 처럼 이상하게 특정 상황에서만 데이터 업데이트가 되서 그랬습니다.

    #12801

    codingapple
    키 마스터

    버튼눌러도 반응이 없는건 ajax 요청하는데 시간이 걸려서 그런게 아닐까요

    시간이 몇초 걸려도 데이터 받아오는게 성공하기만 하면 .then 안의 코드가 성공시 실행됩니다

    .then 안에는 state 변경하는 코드가 들어있을테니 그 때 html도 알아서 재렌더링되겠군요 

     

6 글 보임 - 1 에서 6 까지 (총 6 중에서)
  • 답변은 로그인 후 가능합니다.

About

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

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

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