de
English
Español
Slovenčina
Français
Italiano
Português
Polski
Čeština
Nederlands
Română
Magyar
Svenska
Ελληνικά
БългарскиjComponent 20 (Frontend)
Komponenten, Plugins, Datenbindung und alles, was im Browser läuft.
Erste Schritte mit jComponent 20
Lade das jComponent-Bundle, setze einen Wert im globalen State und zeige ihn mit einem ui-bind-Element an.
Den State lesen, ändern und beobachten
Nutze SET, GET, UPD, PUSH und WATCH, um mit dem globalen State zu arbeiten und zu reagieren, wenn sich ein Pfad ändert.
Eine eigene jComponent schreiben
Registriere eine wiederverwendbare Komponente mit COMPONENT(), rendere sie in make(), reagiere in setter() auf Zustandsänderungen und schreibe mit set() zurück.
Eine Komponente konfigurieren und später neu konfigurieren
Gib einer Komponente Standardoptionen, überschreibe sie im Attribut config, reagiere in configure() und ändere sie zur Laufzeit mit reconfigure().
Lebenszyklus einer Komponente: make, setter und destroy
Wisse, wann jComponent eine Komponente erstellt, aktualisiert und entfernt, und räume Timer und Listener in destroy() auf.
Eingaben mit validate() einer Komponente prüfen
Implementiere validate() in einer Komponente, lies die Zustände invalid, touched und modified und finde ungültige Felder mit ERRORS().
Path Prefix: gemeinsame, Code-Listen, vorübergehende Status und Plugin-Paths
Der erste Charakter eines jComponent-Paths wählt, wo der Wert lebt: * der gemeinsame Zustand, # die Code-Listen, % der vorübergehenden Zustand?|Eine Art von Plugin ist ein Objekt.
Eine Bibliothek laden, bevor eine Komponente startet
Liste Skripte und Stile als Abhängigkeiten einer Komponente auf, damit jComponent sie einmal lädt und die Komponente danach startet.
Komponenten und Plugins mit EXTENSION erweitern
Füge einer bestehenden Komponente von außen Verhalten hinzu, ohne ihren Quellcode zu ändern, mit EXTENSION().
Elemente mit ui-bind anzeigen, ausblenden und stylen
Nutze ui-bind-Commands, um Sichtbarkeit, Klassen und HTML aus dem State umzuschalten, ohne DOM-Code zu schreiben.
Listen mit einem ui-bind-Template rendern
Lege ein Tangular-Template mit dem Command template in ui-bind, um Arrays und Objekte bei jeder Datenänderung zu rendern.
Weitere ui-bind-Commands: Attribute, Werte, Zustand und Formatierung
Setze HTML, Attribute, Formularwerte, den Zustand disabled und ein Textformat aus dem State mit ui-bind-Commands.
ui-bind-Referenz: jeder Befehl, jede Option und jedes Attribut
Alle Befehle von ui-bind mit dem, was jeder einzelne tut, den Optionen, die steuern, wann es ausgeführt wird, und den Attributen, die das Zielelement auswählen.
Komponenteninstanzreferenz: Eigenschaften und Methoden von self
Die Erklärung eines jComponent 20 Komponenten und was seine Instanz (selbst) bietet: Eigenschaften, Wertmethoden, DOM-Hilfer, Ereignisse, Beobachter und Befehl.
State und Logik in einem jComponent-Plugin bündeln
Deklariere ein Plugin mit PLUGIN() und hänge es mit ui-plugin an einen Teil der Seite, mit ? als eigenem Pfad.
Seiten im Browser ohne Neuladen routen
Registriere clientseitige Routen mit ROUTE(), navigiere mit REDIRECT(), lies die URL-Parameter und den Query-String aus NAV und gehe im Verlauf zurück.
Teile einer Seite mit ui-import laden
Hole einen HTML-Teil vom Server mit ui-import oder IMPORT() in ein Element und lass den Teil seine eigenen Komponenten mitbringen.
Code mit Commands und EXEC aufrufen
Registriere Commands mit component.command() und rufe sie mit CMD() auf, oder rufe eine Plugin-Methode mit EXEC('plugin/method') auf.
Events zwischen Komponenten mit ON und EMIT senden
Entkopple Teile der Seite mit globalen Events: EMIT() meldet etwas, ON() hört zu, OFF() hört auf.
Daten im Browser mit CACHE, PREF und COOKIES speichern
Behalte Werte zwischen Besuchen mit CACHE (mit Ablauf), PREF (Benutzereinstellungen) und COOKIES.
Einstellungen mit ENV und der Syntax [key] teilen
Registriere Werte mit ENV() und nutze sie in URLs und Komponentenkonfiguration mit dem Platzhalter [key].
Daten mit AJAX von einer Total.js-Route laden
Rufe aus der Seite eine Total.js-Route mit AJAX() auf und lege die Antwort im jComponent-State ab.
Total.js-API-Routen mit API() aufrufen
Nutze API(url, name, data, callback), um die Actions eines ROUTE('API ...')-Endpunkts aufzurufen, einschließlich Validierungsfehlern.
Dateien mit UPLOAD() und Fortschritt hochladen
Sende ein FormData mit UPLOAD() an eine @upload-Route von Total.js und verfolge den Fortschritt.
Kleine Helper: GUID, HASH, parseConfig, format und group
Nutze die Hilfsfunktionen, die jComponent hinzufügt: zufällige IDs, Hashes, Konfigurationsstrings, Text- und Datumsformatierung und Gruppierung.
Zustands-Kurzbefehle: INC, TOGGLE, NUL, UPDATE, UNWATCH, WAIT, BLOCKED und CACHEPATH
Kleine Funktionen, die einen Wert des Zustands über seinen Pfad ändern oder beobachten, warten, bis ein Wert existiert, etwas nur einmal pro Zeitraum ausführen und einen Wert des Zustands im Cache halten.
Daten-Helfer: QUERIFY, STRINGIFY, ENCRYPT, FN, CL, TRANSLATE, UNAUTHORIZED und Thelpers
Baue Query-Strings, schreibe JSON ohne das, was du nicht willst, kodiere einen Wert mit einem Schlüssel, kompiliere einen Ausdruck, lade Wertelisten, übersetze Texte, prüfe Berechtigungen und füge den Templates Helfer hinzu.
DOM-Helfer: ATTRD, HIDDEN, VISIBLE, WIDTH, STYLE, NODEMOVE, DIFFDOM und APPEARANCE
Lies data-Attribute, frage, ob ein Element angezeigt wird oder auf dem Bildschirm ist, füge ersetzbare Styles hinzu, verschiebe Elemente in ihrem Elternelement, aktualisiere eine Liste ohne Neuzeichnen und setze Farben und Dunkelmodus der Seite.
Komponenten und Plugins finden und aufrufen: FIND, COMPONENTS, SETTER, EXE, TAPI, MIDDLEWARE und ADAPT
Suche die Komponenten der Seite nach Name oder Pfad, rufe eine Methode mehrerer Komponenten gleichzeitig auf, rufe Funktionen per Namen auf, nutze zwei API-Adressen mit TAPI und PIPE, führe Middleware vor einer Route aus und ersetze die Markierungen eines Textes.
Benutzerdefinierte Pfad-Flags mit FLAGS auslösen
Führe benutzerdefinierte Flags aus, beobachte ihre Ereignisse und unterscheide sie von Modelländerungen und reservierten Zustands-Flags.