replaceState () vs pushState ()


Odpowiedzi:


159

replaceState()będzie zmienić adres URL w przeglądarce (np. naciskając przycisk wstecz nie zabierze Cię z powrotem)

pushState() zmieni adres URL i zachowa stary w historii przeglądarki (np. naciśnięcie przycisku Wstecz spowoduje powrót)


57

Z twojego linku

history.replaceState () działa dokładnie tak samo, jak history.pushState (), z wyjątkiem tego, że replaceState () modyfikuje bieżący wpis historii zamiast tworzyć nowy.

replaceState () jest szczególnie przydatny, gdy chcesz zaktualizować obiekt stanu lub adres URL bieżącego wpisu historii w odpowiedzi na jakąś akcję użytkownika.

Jeśli chcesz po prostu zaktualizować wpis historii, użyj replaceState()inaczej użyj pushState(), co zachowa stary wpis i utworzy nowy. Są podobne, ale oba mają różne efekty, więc zależy to od tego, czy chcesz zastąpić lub utworzyć nowe wpisy historii.

Pomyśl o tym tak, jakbym rozdawał talię kart, kładąc jedną kartę na drugiej (odkrytą) i możesz wziąć tylko górną kartę ze stosu (tj. Ostatnią kartę, którą rozdałem). Powiedzmy, że położyłem na stosie Jack of Hearts. Teraz kolejna karta, jeśli używam replaceState, więc zdejmuję tę waletkę kier i wkładam następną. Liczba kart jest taka sama, ponieważ właśnie wymieniliśmy górną kartę. Gdybym pushStatezamiast tego użył , położyłbym następną kartę na wierzchu waleta kier (więc teraz obie istnieją na stosie, a stos jest o jedną kartę wyższy).

Zamień karty w analogii z adresami URL i tak modyfikowana jest historia adresów URL.


2
„history.replaceState () działa dokładnie tak samo, jak history.pushState (), z tym wyjątkiem, że replaceState () modyfikuje bieżący wpis historii zamiast tworzyć nowy”. ten cytat, który znalazłem tutaj developer.mozilla.org/en-US/docs/Web/API/History_API . czy możesz wyjaśnić, czym jest globalna historia przeglądarki. mówi, że wpis jest tworzony w globalnej historii przeglądarki.
Raghu DV,

Co oznacza „globalna historia przeglądarki”? @RaghuDV
stevemao

@keyboardP Awesome wyjaśnione. Wielkie dzięki.
michael.zech
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.