Webprojektentwicklung VUE-Mischungs- und Vererbungsprinzip

Mischen

• Extrahieren Sie die Funktionscodes, die in mehreren Vue-Dateien wiederverwendet werden, in eine einzige JS-Datei und rufen Sie sie bei Bedarf auf.
• Definieren Sie ein Objekt in einer JS-Datei. In das Objekt können Sie Daten, Methoden, Komponenten und andere Codes schreiben, die in <script> in der Vue-Datei definiert werden können.

Mixin-Hinweis (doppelter Name)

• Wenn es eine Duplizierung zwischen dem Datenvariablennamen in der Komponente und dem Datenvariablennamen im Mixin gibt, hat die Komponente Vorrang.
• Wenn es doppelte Namen von Methoden, berechneten und „Wath“ in einer Komponente und von Methoden, berechneten und „Wath“ in einem Mixin gibt, hat die Komponente Vorrang.
• Wenn die Life-Hook-Funktion in der Komponente und die Life-Hook-Funktion im Mixin denselben Namen haben, werden beide ausgeführt, aber die Hook-Funktion in der Komponente wird zuerst ausgeführt.

Lokales Mixin

Globale Mixins

Definition und globale Registrierung

Anruf

erben

• Hinweis: Mehrfachvererbung ist hier nicht geeignet, da es häufiger zu Problemen mit Mehrfachvererbung kommt.
• Zusätzlich zur Vererbung von .vue-Dateien können Erweiterungen auch Objekte in JS-Dateien wie Mixin verwenden.
• Das HTML in der Vorlage in der Datei extends inheritance.vue kann nicht vererbt werden
  

Unterschied zwischen Mixin und Vererbung

• Schauen wir uns zunächst die Definition im offiziellen Dokument an. Tatsächlich können beide als Vererbung verstanden werden.
• Mixins erhalten ein Array von Objekten (was als Mehrfachvererbung verstanden werden kann);
• Was erweitert wird, ist ein Objekt oder eine Funktion (was als einfache Vererbung verstanden werden kann).
• Hinweis: Wenn eine Komponente sowohl Vererbung als auch Mixins verwendet und ein doppelter Name zwischen beiden vorliegt, überschreibt das Mixin die Vererbung.

Oben finden Sie detaillierte Informationen zu den Misch- und Vererbungsprinzipien von VUE bei der Entwicklung von Webprojekten. Weitere Informationen zur Webentwicklung finden Sie in den anderen verwandten Artikeln auf 123WORDPRESS.COM!