Gunnar Bittersmann: Yet another IntersectionObserver mystery

Beitrag lesen

problematische Seite

Ich habe einen Prototypen Codepen mit spread syntax gebastelt: unten ein fixed positioniertes Element (Überschrift „Allgemeine Erklärung der Menschenrechte“), das verschwinden soll, wenn andere Elemente in den Viewport scrollen (die Box zum Logo für Menschen­rechte und die Infobox darunter). Wobei diese Boxen nicht auftreten müssen. Ein Array observedElements der zu beobachtenden Elemente erstellt und einen IntersectionObserver drauf angesetzt:

observer.observe(...observedElements);

Funktioniert – im Prototypen. In the real thing (eine Vue-Anwendung) eingebaut – funktioniert nicht.

Anstelle der spread syntax eine Schleife über die zu beobachtenden Elemente, wie auch im Beispiel in MDN gezeigt:

observedElements.forEach(observedElement => {
	observer.observe(observedElement);
});

Codepen mit forEach loop – und so funktioniert’s dann auch in der Vue-Anwendung.

Warum funktioniert die spread syntax nicht in der Vue-Anwendung? (Ja, das mag für euch schwer zu beantworten sein, ohne die Anwendung zu sehen.)

Warum funktioniert die spread syntax im Prototypen?

Kwakoni Yiquan

--
Ad astra per aspera