In diesem Artikel wird kurz der Unterschied zwischen vue2 und vue3 aus sechs Aspekten beschrieben: Quellcodeebene, Leistungsebene, API-Aspekt, Hook-Funktion zur Verbesserung der Code-Wiederverwendbarkeit, Code-Schreiben und Lebenszyklus
源码层面：
Ausführung
der Unterschied
Ansicht2
Javascript verwendet Flow zur Typerkennung
Ansicht 3
Der Quellcode wird mithilfe von Typoskript umgestaltet, und Vue unterstützt die Typoskript-Unterstützung benutzerfreundlicher
性能层面
Ausführung
der Unterschied
Ansicht2
Verwenden Sie object.defineProperty, um Data-Setter- und Getter-Methoden zu kapern. Objektänderungen müssen zur detaillierten Überwachung mithilfe der API erfolgen
Ansicht 3
Verwenden Sie Proxy, um Datenhijacking zu implementieren, einige API-Fitter ($on, $once, $off) zu löschen usw., Blockbaum, Solt, Diff-Algorithmus usw. zu optimieren.
api方面
Ausführung
der Unterschied
Ansicht2
OptionsAPI schreibt Daten, Methoden, erstellt usw. in Optionen, um Komponentenobjekte zu beschreiben. Mehrere Logiken können sich an unterschiedlichen Orten befinden und die Codekohäsion ist gering.
Ansicht 3
CompositionAPI platziert den modulbezogenen Code an der vereinbarten Stelle, ohne dass eine Suche in mehreren Optionen erforderlich ist
hook函数增加代码复用性
Vue2 verwendet Mixins für die gemeinsame Nutzung von Codelogik. Mixins bestehen auch aus vielen Optionen. Wenn mehrere Mixins vorhanden sind, kann es zu Problemen wie Namenskonflikten kommen.
Vue3 kann über die Hook-Funktion einen Teil der unabhängigen Logik extrahieren und reagiert auch
代码写法方面
Vue3 unterstützt das Schreiben mehrerer Wurzeln in der Vorlage, und vue2 kann nur einen haben
Wenn eine asynchrone Funktion darin enthalten ist und Sie „await“ verwenden müssen, können Sie diese direkt verwenden, ohne vor dem Setup „async“ hinzuzufügen
生命周期方面（大多生命周期前加on）
Ansicht2
Ansicht 3
Lebenszyklus
beforeCreate()
aufstellen()
Bevor die Komponente mit der Erstellung von Dateninstanzen beginnt
erstellt()
aufstellen()
Dateninstanz zur Komponentendatenerstellung abgeschlossen
beforeMount()
onBeforeAMount()
Bevor das DOM gemountet wird
mount()
onMounted()
Die DOM-Montage ist abgeschlossen (die Seite wird gerendert)
beforeUpdate()
onBeforeUpdate()
Vor der Aktualisierung der Komponentendaten
undatiert()
onUpdated()
Nach Aktualisierung der Komponentendaten
beforeDestroy()
onBeforeunmount()
bevor das Bauteil zerstört wird
zerstört()
onUnmontiert()
Nachdem die Komponente zerstört wurde
Zusammenfassen:
vue3, die Nutzungsrate steigt von Jahr zu Jahr, die Version ist derzeit sehr stabil und die Ökologie ist relativ vollständig, was der Haupttrend der zukünftigen Entwicklung von vue sein wird
Die Leistung und Typoskriptunterstützung von Vue3 übertreffen ebenfalls Vue2
ts ist derzeit auch im Frontend beliebt, es wird empfohlen, die Grube zu betreten
Je suppose que tu aimes
Origine blog.csdn.net/qq_51075057/article/details/130679841