replace : true

1. replace: false (기본값)

navigate('/some-path');  // replace: false가 기본값

• 새로운 경로를 히스토리 스택에 추가
• 뒤로 가기 버튼을 누르면 이전 페이지로 돌아갈 수 있음
• 히스토리가 계속 쌓임

→ 히스토리가 쌓인다는 것은 브라우저의 뒤로가기/앞으로가기를 했을 때 방문했던 모든 페이지를 순서대로 이동할 수 있다는 의미

 

 

 

2. replace: true

navigate('/some-path', { replace: true });

• 현재 경로를 새로운 경로로 대체
• 현재 페이지의 히스토리를 새 페이지로 교체
• 뒤로 가기 버튼을 누르면 현재 페이지 이전의 페이지로 이동

 

사용 예시

// 인터뷰 완료 후 결과 페이지로 이동
navigate(`/Person/${projectId}`, { replace: true });

이 경우 replace: true를 사용하는 이유:

• 인터뷰 진행 중인 페이지로 다시 돌아갈 필요가 없음
• 뒤로 가기 시 인터뷰 중간 상태로 돌아가는 것을 방지
• 사용자 경험 개선 (불필요한 히스토리 제거)