프로젝트 진행중 생긴 문제

문제: LocalePage.jsx 에서 button을 클릭하면 state값이 변경되는 함수를 넣어줬다.
리액트 문법상 onClick등 내에서 this.pageUp() 이렇게 쓰면 저 에러가 발생한다
해결방법: this.pageUp으로 고쳐주면 된다. 만약 인자를 받고싶다면 {() => this.pageUp()}으로 문법에 무슨 문제가 있는지 알았다!

  • {() => this.pageUp} 외부에서 this를 받아와서 작동
    this.pageUp 내부에서 this를 참조해서 작동 
    참고)https://kss7547.tistory.com/36

데이터는 받아가셔야죠! 🏃 Promise..

문제 : API에서 값을 받아오기전에 객체를 반환해서 내 파일내에서 그 객체내에 데이터가 존재하지 않다고 뜸
pending ~~~ 에러가 뜬것을 보고 비동기 처리 로직이 아직 완료되지 않은 상태에서 데이터를 받아온것을 확인함
해결방법: 해당하는 함수에 async await 키워드를 적어서 해결!
Promise는 대표적으로 다음과 같은 3가지 상태를 가진다.
Pending(대기): 비동기 처리 로직이 아직 미완료인 상태
Fulfilled(이행): 비동기 처리가 완료되어 promise가 결과 값을 반환해준 상태
Rejected(실패): 비동기 처리가 실패하거나 오류가 발생한 상태
참고)https://spicycookie.me/JavaScript/promise/


Typo in static class property declaration react/no-typos 에러/ 바보같은 나.. 😥

Typo in static class property declaration react/no-typos 에러
문제: Typo in static class property declaration react/no-typos
해결방법: {Component}.PropTypes = {...} -> {Component}.propTypes 대/소문자 변경
참고)https://rok93.tistory.com/entry/Typo-in-static-class-property-declaration-reactno-typos-%EC%98%A4%EB%A5%98-%ED%95%B4%EA%B2%B0%EB%B2%95


api 통신이 끝없이 일어나는 문제! 내 트래픽 누가 가져갔나 😋

문제 :api 통신이 끝없이 일어나는 문제 발생
해결방법 : 찾아보니 componentDidUpdate(prevProps,prevState)에서 this.state 값을 prevProps 과 비교하면서 일치하지 않다보니 무한호출 하는 경우가 생김. 올바르게 고침

좋은 웹페이지 즐겨찾기