Was ist Modularität in Vue?

In Vue besteht die Modularisierung darin, eine einzelne Funktion in ein Modul (Datei) zu kapseln. Die Module sind voneinander isoliert, aber interne Mitglieder können über bestimmte Schnittstellen verfügbar gemacht werden und sie können sich auch auf andere Module verlassen (um die Wiederverwendung von Code zu erleichtern). ) , wodurch die Entwicklungseffizienz verbessert und die spätere Wartung erleichtert wird. Die Vorteile der modularen Entwicklung: 1. Klare Organisation und einfache Wartung; Schnittstellen oder Hängt von anderen Modulen ab.

Die Betriebsumgebung dieses Tutorials: Windows7-System, Vue3-Version, DELL G3-Computer.

Was ist Modularität?

Wir sagen, dass Vue-Projekte nach Modulen unterteilt sind. Was sind also Module?

Modularisierung entspricht der Navigationsleiste unserer Website. Dann kann jedes Navigationselement wie im folgenden Bild gezeigt betrachtet werden mehrere Komponenten.

Bei Verwendung entspricht ein einzelnes Modul dem Dateiverzeichnis unter der Komponente in unserem Vue-Projekt

• Jedes Modul kann mehrere Komponenten haben, und diese Komponenten bilden eine vollständige Modulseite (einzelne Seite)

• Aber jede Modul muss eine

  Hauptdatei (Modul-Elternkomponente)
haben. Diese Datei muss in der Routing-Verwaltung registriert sein (router/index.js). Bei der Registrierung muss sie das folgende Formular erfüllen:

• export default new Router({
    mode: 'history',
    routes: [
  		{
        path: '/',
        name: 'Default',
        redirect: '/home',
        component: Home    }]
      })

Die übrigen Komponenten können sein auf folgende Weise injiziert. Wenn Sie es verwenden, beschriften Sie den Namen im Namensattribut der Komponente in der übergeordneten Komponente (Vue konvertiert den Namen in Kamel-Schreibweise -------- (BookManager——>book-manager) )

• Zunächst müssen Sie die Seite, die Sie verwenden, über den Import importieren

Modularisierung besteht darin, eine einzelne Funktion in einem Modul (Datei) zu kapseln. Die Module sind voneinander isoliert, aber interne Mitglieder können über bestimmte Schnittstellen verfügbar gemacht werden oder auf andere Module zurückgreifen (was die Wiederverwendung von Code erleichtert und so die Entwicklung verbessert). Effizienz) und erleichtern die spätere Wartung).

Warum Modularität nutzen? Die Vorteile der Verwendung von Modularität

• Natürlich können alle Funktionen der Seite ohne die Verwendung modularer Entwicklung realisiert werden, aber dies erhöht den Druck auf Serveranfragen und verringert die Benutzererfahrung, wenn die Seite zu viele Daten erfordert, eine Anfrage Enthält alle angeforderten Daten. Was ist, wenn der Benutzer sie nicht benötigt? Ist eine solche Anfrage noch wirksam? Natürlich hat es keine Auswirkungen, daher kann diese Art von Problem durch die Verwendung der Idee der modularen Entwicklung gelöst werden

Sprechen Sie einfach über die Vorteile der Verwendung modularer Entwicklung

1 Klare Organisation und einfache Wartung2 Machen Sie nicht alles auf einmal. Alle Datenanfragen werden zurückgegeben und die Benutzererfahrung ist gut.

3 Module sind voneinander isoliert, aber interne Mitglieder können über bestimmte Schnittstellen verfügbar gemacht werden, oder Sie können sich auf andere Module verlassen

Vergleich zwischen Modularisierung und Komponentisierung

1. Komponentisierung ist eine unabhängige und wiederverwendbare Code-Organisationseinheit. Das Komponentensystem ist eine der Kernfunktionen von Vue. Es ermöglicht Entwicklern, große Anwendungen mit kleinen, unabhängigen und normalerweise wiederverwendbaren Komponenten zu erstellen 2. Die Komponentenentwicklung kann die Effizienz, Testbarkeit, Wiederverwendbarkeit usw. erheblich verbessern 3. Die Komponentenverwendung wird in Seitenkomponenten, Geschäftskomponenten und allgemeine Komponenten unterteilt.

4 Die von uns geschriebenen Komponenten sind Komponentenkonfigurationen und nicht Komponenten, deren Struktur später generiert wird. Zu den Funktionen, die auf VueComponent basieren, gehören

5. Zu den gängigen Komponentisierungstechnologien gehören Attribut-Requisiten, Slots usw., die hauptsächlich für die Komponentenkommunikation, Erweiterung usw. verwendet werden Die Aufteilung der Komponenten trägt zur Verbesserung der Anwendungsleistung bei.

7 Komponenten sollten eine hohe Kohärenz aufweisen und eine geringe Kopplung aufweisen.

Der Unterschied zwischen ihnen ist

Modularisierung: Sie ist aus der Perspektive der Codelogik unterteilt; sie erleichtert die hierarchische Entwicklung von Code und stellt sicher, dass jedes Funktionsmodul eine einzige Funktion hat. Komponentisierung: Sie ist aus der Perspektive von unterteilt UI-Schnittstelle, die Komponentisierung des Front-Ends erleichtert die Wiederverwendung von UI-Komponenten [Verwandte Empfehlungen: vuejs-Video-Tutorial,

Web-Front-End-Entwicklung

]

Das obige ist der detaillierte Inhalt vonWas ist Modularität in Vue?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!