Asignación de modelos dinámicos a componentes para SPA dynamic-model-to-component-mapping-for-spas
En este documento se describe cómo se produce la asignación de modelos dinámicos a componentes en el SDK de SPA de JavaScript para AEM.
Módulo ComponentMapping componentmapping-module
La variable ComponentMapping se proporciona como paquete NPM al proyecto front-end. Almacena componentes front-end y proporciona una forma para que la aplicación de una sola página asigne componentes front-end a AEM tipos de recursos. Esto permite una resolución dinámica de los componentes al analizar el modelo JSON de la aplicación.
Cada elemento presente en el modelo contiene un :type campo que muestra un tipo de recurso AEM. Cuando se monta, el componente frontal puede procesarse utilizando el fragmento de modelo que ha recibido de las bibliotecas subyacentes.
Consulte la Modelo SPA documento para obtener más información sobre el análisis de modelos y el acceso de componentes front-end al modelo.
Consulte también el paquete npm: https://www.npmjs.com/package/@adobe/aem-spa-component-mapping
Aplicación de página única impulsada por modelo model-driven-single-page-application
Las aplicaciones de una sola página que aprovechan el SDK de SPA de Javascript para AEM están basadas en modelos:
-
Los componentes del front-end se registran a sí mismos en el Almacén de asignación de componentes.
-
A continuación, el Contenedor, una vez que el Proveedor de modelo, se repite sobre el contenido del modelo (
:items). -
En el caso de una página, sus elementos secundarios (
:children) obtenga primero una clase de componente de la Asignación de componentes y luego instancie.
Inicialización de la aplicación app-initialization
Cada componente se amplía con las capacidades del ModelProvider. Por lo tanto, la inicialización adopta la siguiente forma general:
-
Cada proveedor de modelos se inicializa y escucha los cambios realizados en la pieza del modelo que corresponde a su componente interno.
-
La variable
PageModelManagerdebe inicializarse tal y como lo representa el flujo de inicialización. -
Una vez almacenado, el administrador del modelo de página devuelve el modelo completo de la aplicación.
-
Este modelo se pasa entonces a la raíz del front-end Contenedor de la aplicación.
-
Los fragmentos del modelo se propagan finalmente a cada componente secundario individual.
