jComponent 20 (frontend)
Komponenter, plugins, databindning och allt som körs i webbläsaren.
Kom igång med jComponent 20
Ladda jComponent-paketet, sätt ett värde i det globala tillståndet och visa det med ett ui-bind-element.
Läs, ändra och bevaka state
Använd SET, GET, UPD, PUSH och WATCH för att arbeta med det globala state och reagera när en sökväg ändras.
Skriv en egen jComponent
Registrera en återanvändbar komponent med COMPONENT(), rendera den i make(), reagera på tillståndsändringar i setter() och skriv tillbaka med set().
Konfigurera en komponent och omkonfigurera den senare
Ge en komponent standardalternativ, åsidosätt dem i attributet config, reagera i configure() och ändra dem under körning med reconfigure().
En komponents livscykel: make, setter och destroy
Veta när jComponent skapar, uppdaterar och tar bort en komponent, och städa timers och lyssnare i destroy().
Validera indata med en komponents validate()
Implementera validate() i en komponent, läs tillstånden invalid, touched och modified och hitta ogiltiga fält med ERRORS().
Vägförskjutningar: vanliga, kodlistor, tillfälliga tillstånd och plugin-vägar
Den första karaktären av en jComponent-vägen väljer var värdet lever: * den vanliga tillståndet, # kodlistan, % tillfällig tillstånd, ? plugin-status och plugin|En väg som ägs av ett plugin objekt.
Ladda ett bibliotek innan en komponent startar
Lista skript och stilar som en komponents beroenden så att jComponent laddar ned dem en gång och startar komponenten efteråt.
Utöka komponenter och plugins med EXTENSION
Lägg till beteende i en befintlig komponent utifrån, utan att redigera dess källkod, med EXTENSION().
Visa, dölj och formatera element med ui-bind
Använd ui-bind-kommandon för att växla synlighet, klasser och HTML från state, utan att skriva DOM-kod.
Rendera listor med en ui-bind-mall
Lägg en Tangular-mall i ui-bind med kommandot template för att rendera arrayer och objekt varje gång datan ändras.
Fler ui-bind-kommandon: attribut, värden, tillstånd och formatering
Sätt HTML, attribut, formulärvärden, inaktiverat tillstånd och ett textformat från state med ui-bind-kommandon.
ui-bind referens: varje kommandot, alternativ och attribut
Alla kommandon av ui-bind med vad varje gör, de alternativ som kontrollerar när det körs, och attribut som väljer målvakten.
Komponent exempel referens: egenskaper och metoder för själv
Deklarationen av en jComponent 20 komponent och vad dess instans (själv) erbjuder: egenskaper, värdemetoder, DOM assistenter, händelser, observatörer och kommandon.
Samla state och logik i ett jComponent-plugin
Deklarera ett plugin med PLUGIN() och koppla det till en del av sidan med ui-plugin, med ? som dess egen sökväg.
Routa sidor i webbläsaren utan att ladda om
Registrera rutter på klientsidan med ROUTE(), navigera med REDIRECT(), läs URL-parametrarna och query string från NAV och gå bakåt i historiken.
Ladda delar av en sida med ui-import
Hämta en HTML-del från servern in i ett element med ui-import eller IMPORT(), och låt delen ha sina egna komponenter.
Anropa kod med kommandon och EXEC
Registrera kommandon med component.command() och anropa dem med CMD(), eller anropa en plugin-metod med EXEC('plugin/method').
Skicka events mellan komponenter med ON och EMIT
Frikoppla delar av sidan med globala events: EMIT() meddelar något, ON() lyssnar, OFF() slutar lyssna.
Lagra data i webbläsaren med CACHE, PREF och COOKIES
Behåll värden mellan besök med CACHE (med utgångstid), PREF (användarinställningar) och COOKIES.
Dela inställningar med ENV och syntaxen [key]
Registrera värden med ENV() och använd dem i URL:er och komponentkonfiguration med platshållaren [key].
Ladda data från en Total.js-route med AJAX
Anropa en Total.js-route från sidan med AJAX() och lägg svaret i jComponents state.
Anropa Total.js API-routes med API()
Använd API(url, name, data, callback) för att anropa actions i en ROUTE('API ...')-endpoint, inklusive valideringsfel.
Ladda upp filer med UPLOAD() och förlopp
Skicka en FormData till en @upload-route i Total.js med UPLOAD() och följ förloppet.
Små helpers: GUID, HASH, parseConfig, format och group
Använd de hjälpfunktioner som jComponent lägger till: slumpmässiga id:n, hashar, konfigurationssträngar, text- och datumformatering och gruppering.
Genvägar för tillstånd: INC, TOGGLE, NUL, UPDATE, UNWATCH, WAIT, BLOCKED och CACHEPATH
Små funktioner som ändrar eller bevakar ett värde i tillståndet via dess sökväg, väntar tills ett värde finns, kör något bara en gång per period och håller ett värde i tillståndet i cachen.
Datahjälpare: QUERIFY, STRINGIFY, ENCRYPT, FN, CL, TRANSLATE, UNAUTHORIZED och Thelpers
Bygg frågesträngar, skriv JSON utan det du inte vill ha, koda ett värde med en nyckel, kompilera ett uttryck, ladda listor med värden, översätt texter, kontrollera behörigheter och lägg till hjälpare i mallarna.
DOM-hjälpare: ATTRD, HIDDEN, VISIBLE, WIDTH, STYLE, NODEMOVE, DIFFDOM och APPEARANCE
Läs data-attribut, fråga om ett element visas eller finns på skärmen, lägg till stilar som du kan ersätta, flytta element i sin förälder, uppdatera en lista utan att rita om den och ställ in sidans färger och mörka läge.
Hitta och anropa komponenter och plugins: FIND, COMPONENTS, SETTER, EXE, TAPI, MIDDLEWARE och ADAPT
Leta upp sidans komponenter efter namn eller sökväg, anropa en metod hos flera komponenter samtidigt, anropa funktioner via namn, använd två API-adresser med TAPI och PIPE, kör middleware före en rutt och ersätt markörerna i en text.
Skicka egna sökvägsflaggor med FLAGS
Kör egna flaggor, observera deras händelser och skilj dem från modelländringar och reserverade tillståndsflaggor.