Предотвращение дублирования экземпляров в window.history

Question

У меня есть главная страница, где вы можете загружать другие страницы в контейнер. Когда страница загружена, вы все еще находитесь на главной странице, но URL-адрес браузера должен быть установлен на URL-адрес загруженной страницы. При закрытии загруженной страницы URL-адрес должен быть сброшен на адрес главной страницы.

Я хотел бы решить это, просто используя history.replaceState или pushState, и не нужно возвращаться в историю браузера (потому что возврат обратно заставляет некоторые браузеры обновляться и сбрасывать прокрутку).

Мое текущее решение

clickLoadPage => (pageUrl) { 
    closeOtherLoadedPages(); 
    if (isOnMainPage()) 
     pushState(pageUrl) 
    else 
     replaceState(pageUrl) 
} 
clickUnloadPage =>() { 
    replaceState(mainpageUrl); 
} 

Примечание: Он предназначен для только одной страницы, загруженной в любое время. Пример: первая загрузка страницы1. Затем загрузите страницу2. Желаемый эффект: страница 1 закрыта, URL-адрес заменен на страницу2. В этом состоянии возврат в браузере вернется к URL главной страницы.

Проблема заключается в том, что каждый раз, когда вы загружаете новую страницу и закрываете ее, в историю окон добавляется новое состояние с главной страницей. Там должно быть только 1 из этих состояний, но я получаю несколько.

Можно ли решить эту проблему другим способом? Я не так хорошо знаком с api window.history, возможно ли сделать что-то вроде удаления состояния или обеспечения того, чтобы не было добавлено состояний дубликатов?

Answer 1

Когда страница закрывается, вы можете вызвать метод pop из истории, поэтому URL-адрес изменится на предыдущий.

Если вы открыли страницу 1, и вы хотите открыть страницу 2, вам нужно вызвать метод, чтобы закрыть уже открытую страницу, чтобы просмотреть состояние из истории, и только после этого откройте другую страницу.