[React Native] React Navigation 사용하기

React-Navigation

navigate VS replace

• navigate: stack 중에 screen이 있으면 그걸 찾아서 간다.
• replace: 새롭게 replace한다.

나는 거의 navigate로 사용했는데 그러다보니까 예를 들어 노트를 삭제했는데 삭제 후 다시 리스트로 돌아가도록 navigate 메소드를 사용하면, 삭제된 노트도 리스트에서 계속 확인이 됐다.
그래서 replace로 바꾸어주었더니, 바로바로 동기화 완료.

Passing Params

• 넘겨줄 때
  : 가장 중요한 건 제일 바깥쪽 export할 function의 인자로, { navigation, route } 를 넣어주는 것이다. 이게 없으면! 안 돌아간다.

navigation.navigate('Note', {
	noteId: response.data.result['note_id'],
    categoryName: category,
    userId: userId,
    fromUpload: true
})

• 받아올 때
  : 여기도 마찬가지로 navigation, route 설정해주기.

useEffect(() => {
	setUserId(route.params.userId);
    setCategory(route.params.categoryName);
    setNoteId(route.params.noteId);
    setFromUpload(route.params.fromUpload);
}, [noteId]);

참고 공식 문서 -> React Navigation