App - Android 학습 일지

[W2-7] 페이지 로딩시 반복 방지

반투 2022. 6. 27. 19:04

페이지 진입(로딩) 처리

 

import React, { useEffect } from 'react';
import { StyleSheet, View, Text, Alert } from 'react-native';

//export default function MainPage() {
export default function MainPage({ navigation }) {
  useEffect(() => {
    const unsubscrbie = navigation.addListener('focus', (e) => {
      Alert.alert('incomming ~ 메인 페이지에 !');
    });
        return unsubscrbie;
  }, [navigation]);

아래 두 줄에 주목

        return unsubscrbie;
  }, [navigation]);

특히 navigation 구문을 반드시 포함해줘야 {useEffect 에 의해 상태 모니터링 받는 부분에 혼란이 오지 않는다

 

 

app.jsx (diffCHK)