Aurelia - Plugins

Wenn Sie mit dem Erstellen Ihrer App beginnen, möchten Sie meistens einige zusätzliche Plugins verwenden. In diesem Kapitel erfahren Sie, wie Sie Plugins im Aurelia-Framework verwenden.

Standard Plugins

Im letzten Kapitel haben wir gesehen, wie die Standardkonfiguration im Aurelia-Framework verwendet wird. Wenn Sie die Standardkonfiguration verwenden, sind Standard-Plugins verfügbar.

• defaultBindingLanguage() - Dieses Plugin bietet eine einfache Möglichkeit zum Verbinden view-model mit view. Sie haben bereits eine Einweg-Datenbindungssyntax gesehen(${someValue}). Obwohl Sie eine andere Bindungssprache verwenden könnten, wird empfohlen, die Standardbindungssprache zu verwenden.

• defaultResources() - Standardressourcen geben uns einige primitive Konstrukte wie if, repeat, composeusw. Sie können diese Konstrukte sogar selbst erstellen, aber da sie so häufig verwendet werden, hat Aurelia sie bereits in dieser Bibliothek erstellt.

• Router()- Die meisten Anwendungen verwenden eine Art Routing. Daher,Routerist ein Teil der Standard-Plugins. Weitere Informationen zum Routing finden Sie in einem nachfolgenden Kapitel.

• History() - Das Verlaufs-Plugin wird normalerweise zusammen mit verwendet router.

• eventAggregator()- Dieses Plugin wird für die komponentenübergreifende Kommunikation verwendet. Es behandelt das Veröffentlichen und Abonnieren von Nachrichten oder Kanälen in Ihrer App.

Offizielle Plugins

Diese Plugins sind nicht Teil der Standardkonfiguration, werden jedoch häufig verwendet.

• fetch()- Das Fetch-Plugin wird zur Bearbeitung von HTTP-Anfragen verwendet. Sie können eine andere AJAX-Bibliothek verwenden, wenn Sie möchten.

• animatorCSS() - Dieses Plugin bietet eine Möglichkeit, mit CSS-Animationen umzugehen.

• animator-velocity()- Anstelle von CSS-Animationen können Sie auch die Velocity-Animationsbibliothek verwenden. Mit diesen Plugins können wir Velocity in Aurelia-Apps verwenden.

• dialog() - Das Dialog-Plugin bietet ein hochgradig anpassbares modales Fenster.

• i18n() - Dies ist das Plugin für die Internalisierung und Lokalisierung.

• ui-virtualization() - Virtualisierung ist eine nützliche Bibliothek für die Ausführung umfangreicher UI-Aufgaben mit hoher Leistung.

• validation() - Verwenden Sie dieses Plugin, wenn Sie Ihre Daten validieren müssen.

Alle oben erläuterten Plugins werden zum Zeitpunkt des Schreibens dieses Tutorials offiziell vom Aurelia Core Team verwaltet. In Zukunft werden einige weitere nützliche Plugins hinzugefügt. Das folgende Beispiel zeigt, wie Sie Ihre App für die Verwendung von Plugins konfigurieren.

Plugins installieren

Wenn wir zum Beispiel verwenden möchten animator-css und animator-velocitymüssen wir es zuerst installieren.

C:\Users\username\Desktop\aureliaApp>jspm install aurelia-animator-css
C:\Users\username\Desktop\aureliaApp>jspm install aurelia-animator-velocity

Im letzten Kapitel haben Sie gelernt, wie Sie die manuelle Konfiguration verwenden. Wir können unsere Plugins hinzufügenmain.js Datei.

main.js

export function configure(aurelia) {
   aurelia.use
   .defaultBindingLanguage()
   .defaultResources()
   .developmentLogging()
   .router()
   .history()
   .eventAggregator()
   .plugin('aurelia-animatorCSS')
   .plugin('aurelia-animator-velocity')

   aurelia.start().then(() => aurelia.setRoot());
}