인프런 커뮤니티 질문&답변

제가 궁금한건 다른 페이지에 있을 때에도 스냅샷 함수를 가동시켜 비용이 계속해서

발생하는 것을 막기위해 온스냅샷 함수를 unsubscribe, 구독취소하는 코드인데요

어째서 제가 읽기에는

unsubscribe = ~ 온스냅샷함수 ~

.

.

.

return () => unsubscribe함수 실행

useEffect cleanup기능으로 언마운트시 온스냅샷함수를 정지하려는데

다시 온스냅샷함수를 실행?

제가 어떻게 잘못 이해하는건지 모르겠어요 .. ㅠㅠ

export default function Timeline() {
  const [tweets, setTweet] = useState<ITweet[]>([]);
  
  let unsubscribe: Unsubscribe | null = null;
  const fetchTweets = async () => {
    const tweetsQuery = query(
      collection(db, "tweets"),
      orderBy("createdAt", "desc"),
      limit(25)
    );
    unsubscribe = await onSnapshot(tweetsQuery, (snapshot) => {
        const tweets = snapshot.docs.map((doc) => {
          const { tweet, createdAt, userId, username, photo } = doc.data();
          return {
            tweet,
            createdAt,
            userId,
            username,
            photo,
            id: doc.id,
          };
        });
        setTweet(tweets);
      });
    };

    useEffect(() => {
        fetchTweets();
        return () => {
            unsubscribe && unsubscribe();
          };
      }, []);
    }