[Error Log] Possible Unhandled Promise Rejection

👀 상황

Firebase에서 리뷰 데이터를 받아와서 setState 해주는 과정에서 다음과 같은 에러가 발생함.

Possible Unhandled Promise Rejection

const getReviews = async () => {
  const q = query(
    collection(dbService, 'reviews'),
    where('title', '==', title),
  );

  const reviews = [];
  const querySnapshot = await getDocs(q);
  querySnapshot.forEach((doc) => reviews.push({ id: doc.id, ...doc.data() }));
  setRivews(reviews);
};

❓ 원인

async 함수 내에서 promise 에러 처리를 해주지 않은 상태에서 에러가 발생함.

✅ 해결

try-catch를 이용해 에러처리를 해줌.

async-await이 아닌 promise chaning을 사용한다면 .catch(err ⇒ cosnole.log(err) 로 작성해주면 됨.

const getReviews = async () => {
  const q = query(
    collection(dbService, 'reviews'),
    where('title', '==', title),
  );

  try {
    const reviews = [];
    const querySnapshot = await getDocs(q);
    querySnapshot.forEach((doc) =>
      reviews.push({ id: doc.id, ...doc.data() }),
    );
    setRivews(reviews);
  } catch (error) {
    console.log(error);
  }
};