Heim  >  Artikel  >  Web-Frontend  >  Eine kurze Diskussion über Mixin in Vue

Eine kurze Diskussion über Mixin in Vue

小云云
小云云Original
2017-12-13 09:07:391392Durchsuche

Vue bietet einen Mischmechanismus – Mixins –, um eine effizientere Wiederverwendung von Komponenteninhalten zu erreichen. Zuerst dachte ich, es gäbe keinen Unterschied zwischen diesem und Komponenten. . Später fand ich heraus, dass es falsch war. Werfen wir einen Blick auf den Unterschied zwischen Mixins und importierten Komponenten unter normalen Umständen. Nachdem auf die Komponente verwiesen wurde, entspricht dies dem Öffnen eines separaten Bereichs in der übergeordneten Komponente, um entsprechende Vorgänge basierend auf den Werten der Requisiten der übergeordneten Komponente auszuführen. Im Wesentlichen sind die beiden unterschiedlich und relativ unabhängig. Mixins führen nach der Einführung der Komponente den internen Inhalt der Komponente wie Daten und andere Methoden, Methoden und andere Attribute mit dem entsprechenden Inhalt der übergeordneten Komponente zusammen. Dies entspricht der Erweiterung verschiedener Attributmethoden der übergeordneten Komponente nach der Einführung.

Einfache Komponentenreferenz:

Übergeordnete Komponente + untergeordnete Komponente>>> Übergeordnete Komponente + untergeordnete Komponente

Mixins:

Übergeordnete Komponente + untergeordnete Komponente> ;>> neue übergeordnete Komponente

Es ist erwähnenswert, dass bei der Verwendung von Mixins sowohl die übergeordnete als auch die untergeordnete Komponente unterschiedliche Attributmethoden in der untergeordneten Komponente haben, dies bedeutet jedoch nicht, dass sie identisch sind Teilen und verarbeiten Sie diese Variablen gleichzeitig. Es findet keine Kommunikation zwischen den beiden statt, außer der Zusammenführung. Als ich Mixins zum ersten Mal sah, schien es mir naiv zu sein, eine nach unten gerichtete Datenaustauschlösung ähnlich wie Vuex zu sehen, und ich war sehr aufgeregt.

Lassen Sie mich Ihnen das Mixin in Vue vorstellen

1. Was ist Mixin?

Die Mixin-Datei ist ein Objekt, das jede Komponente der Vue-Komponente enthalten kann. Es ist eine sehr flexible Möglichkeit, wiederverwendbare Funktionen von Vue-Komponenten zu verteilen. Wenn ein Mixin von einer Komponente verwendet wird, werden alle Eigenschaften/Methoden im Minxin mit den Eigenschaften/Methoden in der Komponente gemischt.

Zweitens verwenden Sie Mixin

Sie können Mixins-Attribute in Vue-Komponenten haben, und der Werttyp dieses Attributs ist ein Array. Führen Sie Mixin als Element-Mixin des Mixins-Arrays ein: [mixin]

Komponente A wendet Mixin an und die Attribute der beiden, wie Methoden, Komponenten und Anweisungen, werden in demselben Objekt gemischt , Komponenten und Wenn es in Direktiven Attribute mit demselben Namen gibt, werden diese in Mixin ignoriert. Hook-Funktionen mit demselben Namen werden in einem Array zusammengefasst und alle aufgerufen. Die Hook-Funktion des Mixins wird vor der Hook-Funktion der Komponente aufgerufen.

Verwandte Empfehlungen:

riot.js lernen [2] Mixin

Beispiel für eine benutzerdefinierte JS-Mixin-Funktion

Was ist das Konzept von Mixin?

Das obige ist der detaillierte Inhalt vonEine kurze Diskussion über Mixin in Vue. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn