[RN]리액트 네이티브-Today I'm Learned (8)"Context API"

- 오늘 학습한 내용.

Redux, useContext, Mobx 등은 상태값을 통제하는 외부 라이브러리이다.

이것을 왜 한밤 중에 적느냐 하는 이유는 

 

 

...
import { createStackNavigatior } from '@react-navigation/stack';

...

const Stack = createStackNavigatior();

const LoginNavigator = () => {
  return (
    <Stack.Navigator>
      <Stack.Screen 
        ....
      />
    </Stack.Navigator>
  );
};

const MovieNaviagtor = () => {
  return(
    <Stack.Navigator>
      <Stack.Screen 
        ....
      />
      <Stack.Screen 
       	....
      />
    </Stack.Navigator>
  );
};

export default () => {
  const { isLoading, userInfo } = useContext<IUserContext>(UserContext);

	...

  if (isLoading === false ) {
    return <Loading />;
  }
  return(
    <NavigationContainer>
      {userInfo? <MovieNaviagtor /> : <LoginNavigator />}
    </NavigationContainer>
  );
};

- 오늘의 코드 내용.

나는 솔직히 리덕스와 Context api를 배우긴 했지만, 잘 쓴다고 생각하지 않았다.

왜냐하면, 해당 값을 어떻게 넘겨야 하는지 몰랐는데, 이번에 사용하면서 갑자기 벼락을 맞은 것처럼 이해하였다.

Redux나 useContext에서 스테이트를 저장하는 방식은 아직도 잘 모르겠다만, 값을 넘기는 방식은 이해하였다.

(직접 state 자체에 접근이 불가능하다보니 로직을 잘 이해하지 못 하였다.

나는 어디에 값을 넘겨주어야 하는가? 어떻게 넘겨줘야지? )

boolean 타입을 통해서 서버에서 해당 값이 true, false를 리턴해서 넘겨준다면

프론트 단에서 해당 로그인 상태나 logout 상태로 리턴하는 방식을 구현하는 것이다.

 

아직도 해당 값이 저장되는 방식을 잘 모르겠다.

왜냐하면, 해당 값이 어디에 저장되는지 볼수 없기때문이다. 왜냐하면 store 자체에 해당 값이 숨어있기때문에

로직이 헷깔리지만 곧 이해되리라 생각한다.

 

- 소감

소스코드를 분해하고 분석하고 이를 수 없이 따라한다면, 이를 이해하여 진행 할 수 있으리라.