TIL: React Navigation | StackActions - replace(), pop() [221027]

React Navigation 에서 navigation 이동 및 변경해야할 경우
navigation.dispatch()에 StackActions 의 메소드를 조합하여 할 수 있다

StackActions

StackActions 의 메소드를 사용하여 navigation stack 에서의 현재 위치를
변경하거나 삭제할 수 있다

replace()

원하는 name을 갖는 경로로 params 와 함께 이동할 수 있다

import { StackActions } from '@react-navigation/native';

navigation.dispatch(
  StackActions.replace('Profile', {
    user: 'jane',
  })
);

navigation.dispatch({
  ...StackActions.replace('Profile', {
    user: 'jane',
  }),
  source: route.key,
  target: navigation.getState().key,
});

pop()

navigation stack의 이전 화면으로 돌아갈 수 있다
인수로 number를 주게되면 몇 개의 화면을 pop() 할 것인지 지정할 수 있다

import { StackActions } from '@react-navigation/native';

const popAction = StackActions.pop(1);

navigation.dispatch(popAction);

popToTop()

스택의 첫 번째 화면으로 돌아가 다른 모든 stack 내부 화면들을 닫는다