반응형
axios 라이브러리를 사용하면서 겪은 몇가지 에러 문제입니다.
1. useEffect( )에서는 async 사용 불가
useEffect( ) 안에서는 async를 사용할 수가 없더군요.. 그래서 따로 함수를 분리해 선언해주고 그 함수를 useEffect에 넣어주었습니다.
2. axios를 사용할때 비동기임으로 데이터가 필요하다면 await 사용하기
사실 1번 문제가 2번 때문에 일어났는데요.
다음 예시를 보며 설명드리겠습니다.
let a= 'a'
axios.get('요청')
.then((res)=> {
console.log(res.data.a)
a = res.data.a //res.data.a 는 'b'라고 가정하자
})
console.log(a)
이렇게 되면 콘솔에는 어떻게 찍힐까요? b가 두번 찍힐것 같지만 아닙니다.
'b'가 찍히고 'a'가 찍힙니다.
사실 비동기 적인거라 당연한 결과지만 코드를 짤땐 간과하고 짜서 찾는라 좀 걸렸습니다...
앞으로 동기, 비동기를 잘 체크할 수 있게 될 것 같네요.
아무튼 그래서 async await 를 쓰려 했는데 이럴수가 useEffect에서는 안되더라고요? 그래서 1번을 알게 되었습니다.
(근데 사실 then 안에서 처리하면 되긴 합니다.)
반응형
'개발 > Web' 카테고리의 다른 글
[JS] axios.get( ) 사용법 (0) | 2022.01.12 |
---|---|
[Node.js] express에서 json 사용 (0) | 2022.01.12 |
[React] react-cookie를 이용해 쿠키 관리하고 로그인 인증하기 (0) | 2022.01.12 |
[Node.js] jwt토큰 발급과 인증 (jsonwebtoken 라이브러리) (0) | 2022.01.12 |
[Node.js] express .Router( ) / 라우터로 파일 정리하기 (0) | 2022.01.11 |