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

home2 게시판 React 게시판 비동기식처리를 동기식처리로 코드를바꾸고싶습니다.

비동기식처리를 동기식처리로 코드를바꾸고싶습니다.

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

    김범우
    참가자

    비동기식 처리를 동기식으로 바꾸고싶습니다 setTimeout()

    function Test() {
      let [axiosData, setAxiosData] = useState([
        { id: 0, title: "good shoes",
    content: "goodthan 6",
    price: 220000
    }
     ]);
      return (
        <>
          <button
            onClick={() => {
    axios.get("https://codingapple1.github.io/shop/data2.json")
         .then((res) => {
                  setTimeout(() => {
                    setAxiosData(res.data);
                  }, 1000);
                  console.log(axiosData);
                });
            }}
          >
            버튼
          </button>
        </>
      );
    }
    axios 요청한 Promise 상태 데이터를 .then() 을사용했습니다.
    .then()메서드를이용해서 response data [{...},{...}{...}]
    3개의 자료를 setTimeout() state변경함수를 통해
    state 값을 바꾸려하고있습니다 (state변경함수는 비동기식처리
    라서 값이 바뀌기전에 콘솔이 먼저실행되어 변경되기전값이
    찍히는데 여기서 async & await을 이용하지않고
    setTimeout() 함수가 실행이된후에 콘솔이 찍히도록
    순차적인 실행을 하기위해선 어떻게하는게 좋을까요?

    useEffect 나 async & awiat 를 이요하지않고 는방법이없는건가요?

    setAxiosData(res.data);  늦게처리하는 state변경함수를 꼭 사용후에 콘솔이 작동하게

    해보고싶습니다 . . . .ㅠㅠ

    #22731

    codingapple
    키 마스터

    setTimeout은 확실하지않은 방법입니다

    해결책은 useEffect밖에 없습니다 아니면 옛날 class 문법 쓰거나 리액트 신버전 기다리거나 해야합니다

    #22737

    김범우
    참가자

    이부분에서는 그만 놓고 앞으로 가도될만큼 질문하고 공부한거같습니다 .

    선생님 같은질문 10번은 한것같은데 죄송합니다..

    그래도 답변 잘해주셔서 너무 고맙습니다!

    다음에 또 모르는것이 생기면 . . 그때도 지금처럼 같은 질문 받아주실거라 믿습니다 !ㅜ

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

About

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

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

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