TIL - 11/22

Beom·2022년 11월 22일
0

REACT - UDEMY

목록 보기
1/11

React - UDEMY (Section 17)


#226 : 데이터 가져오기
Fetch 는 프라미스를 반환한다
HTTP 요청하는 것이 비동기 작업이기 때문.
useEffect에 넘기는 함수는 프라미스를 반환하면 안됨 -> 넘기는 함수는 async 로 변경하면 안됨
useEffect 안에 async/await을 사용하고 싶다면 안에 새로운 변수를 지어 이 안에 async를 사용하여 중첩함수로 만들어주자. 이 함수를 useEffect의 일부로 실행 -> useEffect가 프라미스를 반환하지 않음

const responseData = await response.json();

프라미스를 반환하기 때문에 await

백앤드에 있는 데이터는 객체 -> responseData는 객체 -> 내가 원하는것 : 배열
for..in을 사용하여 reponseData 객체에서 가져온 것을 밀어넣자 (push)


#228 : 에러 메세지 출력하기

try {
	fetchMeals();
} catch (error) {
	setIsLoading(false);
    setHttpError(error.message);
}

try/catch를 이용하지만 catchMeals는 async 함수이므로 프라미스를 반환한다
에러를 프라미스 안에서 발생시키면 프라미스가 거부한다 -> try/catch가 아닌 await으로 하면 되지만 그러면 전체를 async로 해야 하기에 안됨 -> 별도의 함수로 나중에 호출하자
1. http 요청을 하는 함수
2.에러처리 함수
두개로 나누어서 처리하자
간단한 방법 : 프라미스이기 때문에 catch 로 간단하게 처리하자 (프라미스 안에서 오류 해결하는 방법)


#230 : 폼 값 가져오기
폼 제출할때 방법
1. 키를 누를때마다 스테이트 업데이트하기
2. 폼 전체가 제출될 때 한번에 읽기 (여기서는 useRef를 사용)

0개의 댓글