Storage olayları
Aynı sekmede açık diğer pencerelerde storage değişince haberdar olmayı öğrenirsin.
storage olayı
storage olayı, aynı sitenin başka bir sekmesinde localStorage değiştiğinde tetiklenir. Böylece iki sekme arasında anında haberdar olabilirsin.
window.addEventListener('storage', handler);Önemli nokta: olay aynı sekmede değil, yalnızca diğer sekmelerde tetiklenir. Yani setItem yaptığın sekme bu olayı almaz; diğer açık sekmeler alır.
Olay nesnesinin özellikleri
Olay tetiklendiğinde, işleyici fonksiyon bir olay nesnesi alır. Bu nesne üç yararlı özellik taşır: key değişen anahtarın adını, newValue yeni değeri, oldValue ise eski değeri verir.
window.addEventListener('storage', (event) => {
console.log(event.key, event.newValue);
});Bu özelliklerle neyin değiştiğini ve önceki değerinin ne olduğunu öğrenebilirsin.
Uygulama storage olayını dinle ve bilgileri yaz
window.addEventListener ile 'storage' olayını dinle. Olay tetiklendiğinde event.key ve event.newValue değerlerini console.log ile yaz.
Örnek çözümü göster
window.addEventListener('storage', (event) => {
console.log(event.key, event.newValue);
});Kendini test et
-
storage olayı ne zaman tetiklenir?
// Sekme A: localStorage.setItem('x', '1'); // Sekme B: ?- Aynı sitenin başka bir sekmesinde localStorage değişince
- Aynı sekmede setItem yapınca
- Sayfa yüklendiğinde
- Internet kesilince
Cevabı göster
Aynı sitenin başka bir sekmesinde localStorage değişince — Doğru! storage olayı başka sekmede değişince tetiklenir.
-
storage olayını dinle
window.addEventListener('storage', ____ => { console.log(event.key); });Cevabı göster
window.addEventListener('storage', (event) => { console.log(event.key); }); -
Olay özelliklerini eşleştir
- event.key
- Değişen anahtarın adı
- event.newValue
- Yeni değer
- event.oldValue
- Eski değer
-
Aynı sekmede setItem yaparsan storage olayı tetiklenir mi?
// Tek sekme: localStorage.setItem('x', '1'); // storage olayı ?- Evet, hemen tetiklenir
- Yalnızca sayfa yenilenince
- Yalnızca removeItem için
- Hayır, yalnızca diğer sekmelerde tetiklenir
Cevabı göster
Hayır, yalnızca diğer sekmelerde tetiklenir — Doğru! Aynı sekmede setItem yapınca storage olayı tetiklenmez.