Heim  >  Artikel  >  Web-Frontend  >  Was sollten Sie bei der Verwendung von vue.js beachten?

Was sollten Sie bei der Verwendung von vue.js beachten?

王林
王林Original
2020-11-27 17:08:009690Durchsuche

Dinge, die bei der Verwendung von vue.js zu beachten sind: 1. Filter werden hauptsächlich für die einfache Textkonvertierung verwendet. 3. Die Verwendung von Arrays Komponenten; 6. Komponentenkommunikation.

Was sollten Sie bei der Verwendung von vue.js beachten?

Die Umgebung dieses Artikels: Windows 10, Vue2.9, Dell G3-Computer.

(Lernvideo-Sharing: Javascript-Video-Tutorial)

Bei der Verwendung von vue.js müssen Sie auf folgende Punkte achten:

1. Filter werden hauptsächlich für die einfache Textkonvertierung verwendet Bei der Transformation sollten Sie berechnete Eigenschaften verwenden

2. Verwendung von Anweisungen

  • v-bind wird grundsätzlich für Attribute auf HTML-Elementen wie ID, Klasse, href, src usw. verwendet.

  • v-on ist Wird zum Binden von Ereignis-Listenern wie Click, Dblclick, Keyup, Mousemove usw. verwendet. Dies zeigt in der Methode auf die aktuelle Vue-Instanz. V-Show kann nicht auf Vorlage verwendet werden. V-if und v-show-Nutzungsszenarien

  • v-if Wenn die Bedingung falsch ist, wird das gerenderte Element nicht kompiliert. v-show ist nur ein einfacher CSS-Eigenschaftsschalter, der unabhängig von wahr/falsch kompiliert wird. v-if eignet sich für Szenen, in denen sich die Bedingungen nicht häufig ändern. 3. Der Unterschied zwischen berechneten und Methoden weist keine Klammern auf.

  • computed basiert auf seinem Abhängigkeitscache und wird nur dann erneut validiert, wenn sich die relevanten Abhängigkeiten ändern.

  • Methoden Beim erneuten Rendern wird die Funktion immer erneut aufgerufen und ausgeführt.

4. Verwendung von Schlüsseln

    Wenn Vue Elemente rendert, werden unter Berücksichtigung der Effizienz vorhandene Elemente so weit wie möglich wiederverwendet. Zu diesem Zeitpunkt müssen Sie das Schlüsselattribut zum wiederverwendeten Element hinzufügen array
  • Ersetzen Sie das ursprüngliche Array durch ein neues Array, ohne Auswirkungen auf die Leistung. Beim Rendern von Vue wird versucht, DOM-Elemente wiederzuverwenden
  • Einige Array-Änderungen können von Vue nicht erkannt werden und die Ansicht wird aktualisiert

  • app.books[3]={}app.books.length=1 Das können Sie Verwenden Sie Vue in den oben genannten Fällen separat. .set- und app.books.splice(1)-Verarbeitung

6 Die Verwendung der Komponenten

,
    ,
      ,