[TypeScript] DocumentData Error

2021/12/15 TIL 🔥

모바일 웹에서 동작하는 mp3플레이어 Cliche를 만들었습니다. (만드는 중입니다..)

DB는 firebase를 사용했고 React프레임워크로 화면구성을 했습니다.

문제

로그인 기능구현 중에 원인모를 에러가 발생.

함수 가운데를 잘 보면 doc.data()에 에러 발견!

문제를 보면 'DocumentData' 형식의 인수는 '{ title: string; singer: string; url: string; }' 형식의 매개 변수에 할당될 수 없습니다. 라는 문구가 있음.

🔥 타입지정 해 달란 뜻.

Q. 그냥 any타입쓰면 안되나여 ?

A: 네, 그냥 any타입 써도 됩니다.

하지만 사용하는 순간 타입스크립트를 사용하는 이유가 사라지겠죠?

정확한 타입이 뭔지 알아봅시다.

위에 나오는 doc.data()는 firestore.collection에 있는 데이터들 입니다.

그냥 그에 걸맞는 데이터타입을 지정하면 끝입니다.

이렇게 타입지정하고 윗 부분에 { DocumentData }를 import 합니다. (from "@google-cloud/firestore")

firebase Data이기 때문에 firestore모듈에서 불러옵니다.

😋Done!