Dynamisk mappning av modell till komponent för SPA

I det här dokumentet beskrivs hur den dynamiska mappningen av modell till komponent sker i Javascript SPA SDK för AEM.

ComponentMapping Module

Modulen ComponentMapping tillhandahålls som ett NPM-paket till frontendprojektet. Det lagrar komponenter för användargränssnitt och tillhandahåller ett sätt för Single Page Application att mappa komponenter för användargränssnitt till AEM resurstyper. Detta aktiverar en dynamisk upplösning för komponenter när JSON-modellen för programmet analyseras.

Varje objekt i modellen innehåller ett :type-fält som visar en AEM resurstyp. När den är monterad kan den främre komponenten återge sig själv med det fragment av modellen som den har fått från de underliggande biblioteken.

Läs SPA Blueprint-dokumentet om du vill ha mer information om modellparsning och åtkomst till modellens front-end-komponent.

Se även npm-paketet: https://www.npmjs.com/package/@adobe/aem-spa-component-mapping

Modellstyrt Single Page-program

Single Page-program som använder Javascript SPA SDK för AEM är modelldrivna:

1. Front-end-komponenter registrerar sig för Component Mapping Store.

2. Sedan itererar behållaren, när den har fått en modell av modellprovidern, över sitt modellinnehåll ( :items).

3. För en sida hämtar dess underordnade ( :children) först en komponentklass från komponentmappningen och instansierar den sedan.

Programinitiering

Varje komponent utökas med funktionerna i ModelProvider. Initieringen har därför följande allmänna form:

1. Varje modellprovider initierar sig själv och lyssnar efter ändringar som gjorts i den del av modellen som motsvarar dess inre komponent.

2. PageModelManager måste initieras så som den representeras av initieringsflödet.

3. När sidmodellhanteraren har lagrats returnerar den hela appmodellen.

4. Den här modellen skickas sedan till frontendroten Container-komponenten i programmet.

5. Delar av modellen sprids slutligen till varje enskild underordnad komponent.

Resurser för Business.Adobe.com