React ist eine von Facebook entwickelte JS-Komponentenbibliothek zum Erstellen von Front-End-Schnittstellen. Aufgrund ihres starken Hintergrunds weist diese Bibliothek keine Probleme bei der technischen Entwicklung auf. Dieser Artikel führt Sie hauptsächlich in die relevanten Informationen zum Hinzufügen und Löschen von OnScroll-Ereignissen in React.Js ein. Der Artikel stellt es ausführlich anhand von Beispielcode vor. Es hat einen gewissen Referenz-Lernwert für alle, die es beim Lernen oder Arbeiten benötigen Kommen Sie und lernen Sie gemeinsam.
Vorteile von React
Lösen Sie das Problem, dass sich Daten ständig ändern und bei der Entwicklung großer Projekte schwierig zu handhaben sind; 🎜> Komponentenorientierte Entwicklung, die die Entwicklung beschleunigt;
Einseitiger Datenfluss, der beim Auffinden von Problemen hilfreich ist; Es gibt einen Satz in React. Der Diff-Algorithmus kann schnell die Gesamtposition berechnen, die geändert werden muss, um beispielsweise eine schnelle Teilaktualisierung zu erreichen: Nach der Berechnung werden die Unterschiede verglichen dann eingefügt;
Vorwort
Um das Scrollen zu erreichen, müssen Sie das Scroll-Ereignis in ComponentWillMount registrieren, window.addEventListener(‘scroll’, this.onScroll.bind(this)). Das Hinzufügen von Ereignissen ist sehr einfach.
Es ist einfach hinzuzufügen, aber schwierig zu löschen. Das oben genannte Entfernen kann nicht gelöscht werden. Wenn Sie auf anderen Seiten scrollen, wird das Ereignis in onScroll ausgelöst. Zu diesem Zeitpunkt wird ein Fehler gemeldet, der besagt, dass die Komponente deinstalliert wurde und nicht ausgeführt werden kann.
Ich dachte, ich wäre darauf gestoßen und habe eine Lösung gefunden. Ich habe einen Artikel darüber gefunden, wie man Scroll entfernt.
Der Code lautet wie folgt:
Verwandte Empfehlungen: Das Ereignis onscroll
componentDidMount() {
regScroll(this.handler.bind(this));
//window.addEventListener('scroll', this.handler.bind(this),false)
}
componentWillUnmount() {
window.onscroll = '';
//window.removeEventListener('scroll', this.handler.bind(this),false)
}
//添加事件监听
function regScroll(myHandler) {
if (window.onscroll === null) {
window.onscroll = myHandler
} else if (typeof window.onscroll === 'function') {
var oldHandler = window.onscroll;
window.onscroll = function () {
myHandler();
oldHandler();
}
}
}
//删除所有事件监听
function removeScrollHandler(){
window.onscroll=''
}Über die Fehlerbeschreibung des onScroll-Ereignisses, das dreimal pro Scroll in IE6_javascript ausgelöst wird Fähigkeiten
Das obige ist der detaillierte Inhalt vonAusführliche Erklärung zum Hinzufügen und Löschen von onScroll-Ereignissen in React.Js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
