2016-04-29 15 views
5

data güncel sayfa durumumu kaydetmek için aşağıdaki kodu kullanıyorum.Geçmişe yeni stateObject ekleme veya ekleme

window.history.pushState({myData: data}, "RandomTitle", '#'); 

Ancak şimdi, scrollTop olan başka bir değeri de kaydetmek istiyorum. Ve

window.history.pushState({scrollTop: scrollTop}, "RandomTitle", '#'); 

yaparsanız kod yukarıdaki yenisi ile geçmiş durumunu değiştirir ve myData gitmiş olacak.

Sorun, tarih yazımda myData iken scrollTop ekleyebilir miyim? Ya da sadece window.history.state.addObject falan gibi bir işlev var mı diye düşünüyorum, böyle başlangıçta

window.history.pushState({myData: data, scrollTop: 0}, "RandomTitle", '#'); 
// To change the scrollTop in history state 
window.history.state.scrollTop = $(window).scrollTop(); 

ayarlamak gerekir.

cevap

4

Varsayılan olarak history.state.addObject işlevi yoktur. history.state, ittiğiniz nesneyi (ve başka hiçbir şeyi) içerir.

addObject yöntemine sahip bir şeyi zorlayabilirsiniz, ancak iyi bir fikir gibi görünmüyor. Değişikliğin geçmişte yeni bir durum olarak itilmesini istiyorsanız, her seferinde her seferinde açıkça devlete zorlamanız gerekir. Ve yeni bir durumu zorladığınızda, bir önceki nesneyi mutasyona uğratmaktan kaçınmak istersiniz. Bu, aynı durum nesnesini kullanır ve değiştirirseniz (the standard, history.state gerçek durum verilerinin bir kopyası olması durumunda bile) gerçekleşir. . Bunun yerine yeni bir nesne oluşturmalısınız (önceki durumun bir kopyası olabilir).

İşte bunu nasıl yapabilirsiniz. Object.assign olarak

window.history.pushState(
    Object.assign({}, window.history.state, {scrollTop: scrollTop}), 
    "RandomTitle", '#' 
); 

tarihinin hiçbir mevcut durum olsa bile bu çalışacaktır (yani window.history.state olan undefined) undefined argümanları göz ardı eder.

function extendHistoryState(){ 
    arguments[0] = Object.assign({}, window.history.state, arguments[0]); 
    window.history.pushState.apply(window.history, arguments); 
} 

Tam pushState (aynı argümanları) gibi çalışır aynı zamanda yeni durumda önceki durumuna özelliklerini kopyalar dışında:

Ayrıca bunu otomatik hale bu işlevi kullanabilirsiniz. Bunun yerine önceki kod yapabileceğiniz: URL parametre hem pushState yöntemleri arasında aynıdır

extendHistoryState({scrollTop: scrollTop}, "RandomTitle", '#'); 
+0

'a yeniden atamanız gerekir. Yanıtınız ve btw'niz için teşekkürler, Object.assign sonra bir koma kaçırıyorsunuz '. Şimdi, bu ifadeyi bir kereden fazla çalıştırırsam, tarihçemde 'scrollTop' veya' myData' değişkenlerimi değiştirmek için artık işe yaramıyor. – choz

+0

Sağ. Teşekkür ederim. Güncellenmiş. –

+0

Çalışmıyor olmasının nedeni, önceki durumun değerinin eklemek istediğiniz yeni değerler üzerinde önceliğe sahip olmasından kaynaklanmaktadır (yani, önceki durum bir değer içeriyorsa, ne olursa olsun saklanmıştı). Bu yeni değerleri 'Object.assign' argümanlarının sonunda erteleyerek değiştirdim. –

0

yana, aslında onun yerine yerine tarihine yeni bir devlet ekliyorsanız. Durum verilerini ayrı tutmak için farklı bir URL belirtmeniz veya nesneleri birleştirip yeniden