Heim > Artikel > Web-Frontend > Wie Vue.js Komponenten aufteilt
Was ich Ihnen dieses Mal zeige, ist, wie Sie Dateien in Vue.js gruppieren . Dieser Artikel gibt Ihnen eine gute Analyse.
Für einige gemeinsame Seiten können alle zusammensitzen und Code eingeben. Nachdem diese Seite fertiggestellt ist, können jedoch auch andere Seiten als System mit komplexen Funktionen erstellt werden, insbesondere für die Verwendung einiger geeigneter ModularisierungEntwickeltes Framework, das erscheint sehr ineffizient, daher schauen wir uns einfach an, wie Komponenten in Vue aufgeteilt werden.
Zusammenfassend gibt es zwei Möglichkeiten, es zu unterteilen: Die eine besteht aus den Funktionsblöcken auf der Seite: Auswählen, Seitenaufteilung und einige Teile, für deren Implementierung viel Code erforderlich ist gruppieren oder klassifizieren. Es gibt auch eine Möglichkeit, es nach Seitenbereich, Kopfzeile, Fußzeile und Seitenleiste zu unterteilen. Wie werden Vue-Komponenten implementiert, nachdem Komponenten vorhanden sind?
APP.vue ist ein Eingang zum Projekt, und die von uns geteilten Komponenten sind auch Objekte In APP.vue verwenden wir Import, um jede Komponente zu importieren Import, Header bezieht sich auf die Datei header.vue auf der rechten Seite. Diese Schreibmethode ist eine Schreibmethode von es6. Wenn Sie die Komponentisierung von es6 nicht benötigen, müssen Sie natürlich auch eine andere erforderliche verwenden s, um einen Verpackungsprozess zu schreiben und durchzuführen, wenn Sie diese beiden Komponenten einfach in app.vue einführen Im Inneren sind diese beiden Komponenten noch nicht auf der Seite verfügbar.
In Vue muss diese Komponente über Komponenten registriert und importiert werden
Fügen Sie es ein und schreiben Sie dann
props gibt und eine Nachricht registriert ist, wenn unsere app.vue die Header-Komponente aufruft Das Header-Attribut schreibt eine Nachricht und übergibt alle Daten in app.vue an header.vue. Alles wird durch den Vue-Mechanismus implementiert. Wenn msg hier nicht in header.vue geschrieben wird, können die Attribute nicht abgerufen werden.
Ich glaube, dass Sie die Methode beherrschen, nachdem Sie die obige Einführung gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!
Verwandte Lektüre:
Über HTTP/2-Server-PushWie NVM verschiedene Versionen von Knoten verwaltetSo ermitteln Sie, ob die CheckBox-Auswahl leer istDas obige ist der detaillierte Inhalt vonWie Vue.js Komponenten aufteilt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!