Sayfayı Yenilemeden URL’de ki hastagi değiştirme
Bir proje içerisinde tab kullanımı vardı, talep doğrultusunda ilk açılışta yer yer sekmelerin değişmesi gerekiyordu.
const url = new URL(window.location.href); url.searchParams.set('param1', 'val1'); url.searchParams.delete('param2'); window.history.replaceState(null, null, url); // veya pushState
Stack over flow üzerinde bulduğum cevabıda buraya kendime not almak için bırakıyorum. Detayları merak edenler yorum olarak yazabilirler.
const url = new URL(window.location.href);
: URL
sınıfının bir örneğini oluşturarak mevcut sayfanın URL’sini alır ve url
değişkenine atar. Bu, tarayıcıdaki mevcut sayfanın URL’sini temsil eden bir URL nesnesi elde etmenizi sağlar.
url.searchParams.set('param1', 'val1');
: searchParams
özelliği, URL’nin sorgu parametrelerine erişmek için kullanılır. Bu satır, param1
adında bir sorgu parametresi ekler ve değerini 'val1'
olarak ayarlar. Eğer param1
zaten varsa, değeri güncellenir.
url.searchParams.delete('param2');
: Bu satır, param2
adında bir sorgu parametresini kaldırır. Eğer param2
yoksa, bu işlem bir değişiklik yapmaz.
window.history.replaceState(null, null, url);
: Bu satır, tarayıcının geçmişini günceller. replaceState
yöntemi, tarayıcının geçmişine yeni bir durum ekler ve mevcut sayfanın URL’sini değiştirir. İlk iki parametre state
ve title
olup, bu örnekte null
olarak belirtilmiştir çünkü bu parametrelerin şu anda kullanılmasına gerek yoktur. Üçüncü parametre url
‘dir ve güncellenmiş URL’yi temsil eden url
değişkenini içerir.
Bu kod parçası, mevcut sayfanın URL’sindeki sorgu parametrelerini değiştirir ve bu değişiklikleri tarayıcının geçmişine kaydeder. Sonuç olarak, sayfa URL’si yeni parametrelerle güncellenmiş ve tarayıcının geri düğmesiyle geri gidildiğinde bu güncellemeleri içerecektir.
Bir yanıt yazın