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.
La función Editor de aplicaciones (SPA) de una sola página requiere AEM 6.4 service pack 2 o posterior.
El Editor de SPA es la solución recomendada para proyectos que requieren SPA procesamiento del lado del cliente basado en el marco de trabajo (por ejemplo, React o Angular).
El módulo 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 campo :type
que expone un tipo de recurso AEM. Cuando se monta, el componente front-end puede procesarse utilizando el fragmento de modelo que ha recibido de las bibliotecas subyacentes.
Consulte el documento SPA modelo 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
Las aplicaciones de una sola página que utilizan el SDK de SPA de Javascript para AEM están basadas en modelos:
Los componentes front-end se registran en el Almacenamiento de asignación de componentes.
A continuación, el Contenedor, una vez proporcionado con un modelo por el Proveedor del modelo, se repite sobre su contenido del modelo ( :items
).
En el caso de una página, sus elementos secundarios ( :children
) primero obtienen una clase de componente de la Asignación de componentes y luego la instancian.
Cada componente se amplía con las capacidades de ModelProvider
. Por consiguiente, la inicialización tiene 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 interior.
El PageModelManager
debe inicializarse como representado por el flujo de inicialización.
Una vez almacenado, el administrador de modelos de página devuelve el modelo completo de la aplicación.
A continuación, este modelo se pasa al componente raíz Contenedor del front-end de la aplicación.
Las partes del modelo se propagan finalmente a cada componente secundario individual.