ForgejComponent
nl

jComponent 20 (frontend)

Componenten, plugins, databinding en alles wat in de browser draait.

ReceptTags

Aan de slag met jComponent 20

Laad de jComponent-bundel, zet een waarde in de globale state en toon haar met een ui-bind-element.

jcomponentfrontendbinding

De state lezen, wijzigen en bekijken

Gebruik SET, GET, UPD, PUSH en WATCH om met de globale state te werken en te reageren wanneer een pad verandert.

jcomponentfrontendstate

Een eigen jComponent schrijven

Registreer een herbruikbare component met COMPONENT(), render hem in make(), reageer op statuswijzigingen in setter() en schrijf terug met set().

jcomponentfrontendcomponents

Een component configureren en later herconfigureren

Geef een component standaardopties, overschrijf ze in het attribuut config, reageer in configure() en wijzig ze tijdens het draaien met reconfigure().

jcomponentfrontendcomponents

Levenscyclus van een component: make, setter en destroy

Weet wanneer jComponent een component aanmaakt, bijwerkt en verwijdert, en ruim timers en listeners op in destroy().

jcomponentfrontendcomponents

Invoer valideren met validate() van een component

Implementeer validate() in een component, lees de statussen invalid, touched en modified en vind ongeldige velden met ERRORS().

jcomponentfrontendvalidationforms

Path prefixes: gemeenschappelijke, code lijsten, tijdelijke status en plugins paden

De eerste personage van een jComponent pad kiest waar de waarde leeft: * de gemeenschappelijke staat, # de code lijsten, % de tijdelijke staat, ? de plugin staat en plug-in|Een eigenschap van een plugin object.

jcomponentfrontendpathsstate

Een bibliotheek laden voordat een component start

Som scripts en stijlen op als afhankelijkheden van een component zodat jComponent ze één keer downloadt en de component daarna start.

jcomponentfrontendcomponentsdependencies

Componenten en plugins uitbreiden met EXTENSION

Voeg van buitenaf gedrag toe aan een bestaande component, zonder haar broncode te wijzigen, met EXTENSION().

jcomponentfrontendcomponents

Elementen tonen, verbergen en opmaken met ui-bind

Gebruik ui-bind-commando's om zichtbaarheid, klassen en HTML vanuit de state om te schakelen, zonder DOM-code te schrijven.

jcomponentfrontendbinding

Lijsten renderen met een ui-bind-template

Zet een Tangular-template in ui-bind met het commando template om arrays en objecten te renderen telkens wanneer de gegevens veranderen.

jcomponentfrontendbindingtemplates

Meer ui-bind-commando's: attributen, waarden, status en opmaak

Stel HTML, attributen, formulierwaarden, de uitgeschakelde status en een tekstopmaak in vanuit de state met ui-bind-commando's.

jcomponentfrontendbinding

ui-bind referentie: elke opdracht, optie en attribute

Alle bestellingen van ui-bind met wat elk doet, de opties die controleren wanneer het loopt, en de attributen die het doelelement kiezen.

jcomponentfrontendbindingreference

Component instantie verwijzing: eigenschappen en methoden van zichzelf

De verklaring van een jComponent 20 component en wat de instantie (zelf) biedt: eigenschappen, waardenmethoden, DOM-helpers, evenementen, waarnemers en bestellingen.

jcomponentfrontendcomponentsreference

State en logica bundelen in een jComponent-plugin

Declareer een plugin met PLUGIN() en koppel hem aan een deel van de pagina met ui-plugin, met ? als zijn eigen pad.

jcomponentfrontendplugins

Pagina's in de browser routeren zonder opnieuw te laden

Registreer routes aan de clientkant met ROUTE(), navigeer met REDIRECT(), lees de URL-parameters en de query string uit NAV en ga terug in de geschiedenis.

jcomponentfrontendroutingspa

Delen van een pagina laden met ui-import

Haal een HTML-deel van de server in een element met ui-import of IMPORT() en laat het deel zijn eigen componenten meebrengen.

jcomponentfrontendimport

Code aanroepen met commando's en EXEC

Registreer commando's met component.command() en roep ze aan met CMD(), of roep een plugin-methode aan met EXEC('plugin/method').

jcomponentfrontendcommands

Events tussen componenten sturen met ON en EMIT

Ontkoppel delen van de pagina met globale events: EMIT() kondigt iets aan, ON() luistert, OFF() stopt met luisteren.

jcomponentfrontendevents

Gegevens in de browser opslaan met CACHE, PREF en COOKIES

Bewaar waarden tussen bezoeken met CACHE (met verlooptijd), PREF (gebruikersvoorkeuren) en COOKIES.

jcomponentfrontendstorage

Instellingen delen met ENV en de syntaxis [key]

Registreer waarden met ENV() en gebruik ze in URL's en componentconfiguratie met de plaatsaanduiding [key].

jcomponentfrontendconfig

Gegevens laden van een Total.js-route met AJAX

Roep vanaf de pagina een Total.js-route aan met AJAX() en zet het antwoord in de jComponent-state.

jcomponentfrontendajaxrouting

Total.js-API-routes aanroepen met API()

Gebruik API(url, name, data, callback) om de acties van een ROUTE('API ...')-endpoint aan te roepen, inclusief validatiefouten.

jcomponentfrontendajaxapi

Bestanden uploaden met UPLOAD() en voortgang

Stuur een FormData naar een @upload-route van Total.js met UPLOAD() en volg de voortgang.

jcomponentfrontenduploadfiles

Kleine helpers: GUID, HASH, parseConfig, format en group

Gebruik de hulpfuncties die jComponent toevoegt: willekeurige id's, hashes, configuratiestrings, tekst- en datumopmaak en groeperen.

jcomponentfrontendutilities

Statussnelkoppelingen: INC, TOGGLE, NUL, UPDATE, UNWATCH, WAIT, BLOCKED en CACHEPATH

Kleine functies die een waarde van de status via zijn pad wijzigen of in de gaten houden, wachten tot een waarde bestaat, iets maar één keer per periode uitvoeren en een waarde van de status in de cache bewaren.

jcomponentfrontendstateutilities

Datahelpers: QUERIFY, STRINGIFY, ENCRYPT, FN, CL, TRANSLATE, UNAUTHORIZED en Thelpers

Bouw querystrings, schrijf JSON zonder wat je niet wilt, codeer een waarde met een sleutel, compileer een expressie, laad lijsten met waarden, vertaal teksten, controleer rechten en voeg helpers toe aan de sjablonen.

jcomponentfrontendutilitiestemplates

DOM-helpers: ATTRD, HIDDEN, VISIBLE, WIDTH, STYLE, NODEMOVE, DIFFDOM en APPEARANCE

Lees data-attributen, vraag of een element getoond wordt of op het scherm staat, voeg vervangbare stijlen toe, verplaats elementen binnen hun ouder, werk een lijst bij zonder opnieuw te tekenen en stel de kleuren en de donkere modus van de pagina in.

jcomponentfrontenddomutilities

Componenten en plugins zoeken en aanroepen: FIND, COMPONENTS, SETTER, EXE, TAPI, MIDDLEWARE en ADAPT

Zoek de componenten van de pagina op naam of pad, roep een methode van meerdere componenten tegelijk aan, roep functies bij naam aan, gebruik twee API-adressen met TAPI en PIPE, voer middleware uit vóór een route en vervang de markeringen van een tekst.

jcomponentfrontendcomponentsapi

Verstuur aangepaste padvlaggen met FLAGS

Voer aangepaste vlaggen uit, observeer hun gebeurtenissen en onderscheid ze van modelwijzigingen en gereserveerde statusvlaggen.

jcomponentflagseventspaths