Was ist der Unterschied zwischen Vue- und Mini-Programmen?

Der Unterschied zwischen Vue- und Miniprogrammen: 1. Vue fordert im Allgemeinen Daten in erstellt oder gemountet an, während es in Miniprogrammen Daten in onLoad oder onShow anfordert. 2. Vue bindet den Wert einer Variablen dynamisch an einen bestimmten Wert des element Bei der Angabe eines Attributs wird vor der Variablen ein Doppelpunkt eingefügt, und wenn das Applet den Wert einer Variablen an ein Elementattribut bindet, wird dieser in zwei geschweifte Klammern eingeschlossen. 3. Vue verwendet „v-if“; und „v-show“ „Steuern Sie das Anzeigen und Ausblenden von Elementen. Das Miniprogramm verwendet „wx-if“ und versteckte Steuerung.

Die Betriebsumgebung dieses Artikels: Windows 10-System, Vue3-Version, Dell G3-Computer.

Was ist der Unterschied zwischen Vue- und Miniprogrammen?

1. Die Lebenszyklusfunktionen sind unterschiedlich:

- Das WeChat-Miniprogramm ist onLoad: Laden der Seite, onShow: Seitenanzeige, onReady: das anfängliche Rendern von Die Seite ist fertig, onHide: Seite ausgeblendet, onUnload: Seite entladen.

- Die Hook-Funktion von Vue wird beim Springen zu einer neuen Seite ausgelöst, aber die Hook-Funktion des Miniprogramms löst bei verschiedenen Sprungmethoden der Seite unterschiedliche Hooks aus. Beforecreate, Created eignen sich für Netzwerkanfragen, BeforeMout aktualisiert Daten, verschoben, BeforeUpdate, Updated, BeforeDestory, Destroyed.

Zweitens ist die Datenanforderungszeit unterschiedlich:

Wenn die Seite geladen wird, um Daten anzufordern, ist die Verwendung der beiden Hooks im Allgemeinen etwas ähnlich, während in Miniprogrammen Daten angefordert werden fordert Daten in onLoad an oder fordert Daten in onShow an.

3. Die Datenbindungsmethoden sind unterschiedlich:

Wenn Vue den Wert einer Variablen dynamisch an ein Attribut des Elements bindet, wird vor der Variablen ein Doppelpunkt eingefügt. Miniprogramm: Wenn der Wert einer Variablen an ein Elementattribut gebunden ist, wird er in zwei geschweifte Klammern eingeschlossen. Wenn keine Klammern enthalten sind, wird er als Zeichenfolge betrachtet.

4. Das Anzeigen und Ausblenden von Elementen ist unterschiedlich:

Verwenden Sie in Vue v-if und v-show, um das Anzeigen und Ausblenden von Elementen zu steuern. Verwenden Sie im Applet „wx-if“ und „hidden“, um die Anzeige und das Ausblenden von Elementen zu steuern.

5. Die Ereignisverarbeitung ist anders:

vue: Verwenden Sie v-on:event, um Ereignisse zu binden, oder verwenden Sie @event, um Ereignisse zu binden; verwenden Sie in Miniprogrammen bindtap="" oder Catchtap='' Binden Sie Ereignisse, Catchtap verhindert, dass Ereignisse sprudeln.

6. Die bidirektionale Datenbindung ist unterschiedlich:

In Vue müssen Sie nur ein V-Modell zum Formularelement hinzufügen und dann einen entsprechenden Wert in den Daten binden, wenn der Inhalt des Formulars Element ändert sich Wenn sich der entsprechende Wert in den Daten ändert, ändert sich auch entsprechend. Wenn sich im Miniprogramm der Formularinhalt ändert, wird die an das Formularelement gebundene Methode ausgelöst. In dieser Methode wird dann der Wert im Formular dem Wert in den Daten über this.setData({key:value} zugewiesen. ) entsprechender Wert.

7. Bindungsereignisparameter sind unterschiedlich:

In Vue müssen Bindungsereignisparameter nur als formale Parameter in der Methode übergeben werden, die das Ereignis auslöst. Im Applet können Sie in der Methode zum Binden von Ereignissen keine Parameter direkt übergeben. Sie müssen die Parameter als Attributwerte verwenden, sie an das Datenattribut des Elements binden und dann e.currentTarget.dataset.* im verwenden Methode abrufen und damit die Parameterübertragung abschließen.

8. Die Kommunikation zwischen übergeordneten und untergeordneten Komponenten ist unterschiedlich:

Schaffung von untergeordneten Komponenten ist unterschiedlich:

• Erzählungen in Vue:

1 . Bei Bedarf verwenden. Eingeführt durch Import in der übergeordneten Komponente.

3. In der Vorlage verwenden.

Im Miniprogramm benötigen Sie:

• 1. Deklarieren Sie die Datei in der JSON-Datei der Unterkomponente json der übergeordneten Komponente, die eingeführt werden muss, geben Sie den Komponentennamen und den Pfad der importierten Komponente ein.

4 Importieren Sie ihn einfach direkt in die übergeordnete Komponente Übergeben Sie verschiedene Werte:

In Vue,

Um Daten von einer übergeordneten Komponente an eine untergeordnete Komponente zu übergeben, müssen Sie nur einen Wert über v-bind in der untergeordneten Komponente übergeben. Empfangen Sie es über Requisiten, um die Datenübertragung zwischen der untergeordneten Komponente und der übergeordneten Komponente abzuschließen this.emit Übergeben Sie Methoden und Daten an die übergeordnete Komponente.

Im Miniprogramm

• weist die übergeordnete Komponente den Wert direkt einer Variablen zu und empfängt in den Eigenschaften der untergeordneten Komponente den übergebenen Wert.

Wenn die übergeordnete Komponente die Methode der Unterkomponente aufrufen möchte

vue fügt der Unterkomponente ein Ref-Attribut hinzu. Die Unterkomponente kann über den Wert von this.refs.ref abgerufen werden, und dann kann jede Methode in der Unterkomponente abgerufen werden angerufen. .

Das Applet besteht darin, einer Unterkomponente eine ID oder Klasse hinzuzufügen, dann die Unterkomponente über this.selectComponent zu finden und dann die Methode der Unterkomponente aufzurufen.

Empfohlenes Lernen: „nodejs-Video-Tutorial“

Das obige ist der detaillierte Inhalt vonWas ist der Unterschied zwischen Vue- und Mini-Programmen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!