SPA的动态模型到组件映射

本文档介绍了AEM的Javascript SPA SDK中如何进行动态模型到组件的映射。

注意

对于需要基于SPA框架的客户端渲染(如“反应”或“角度”)的项目,建议使用SPA编辑器。

组件映射模块

ComponentMapping 模块作为NPM包提供给前端项目。 它存储前端组件,并为单页应用程序将前端组件映射到AEM资源类型提供了一种方法。 这样,在解析应用程序的JSON模型时,可动态解析组件。

模型中存在的每个项目都包含一个 :type 公开AEM资源类型的字段。 装载后,前端组件可以使用它从基础库接收的模型片段来呈现自己。

有关模型分 析和对模型的前端组件访问 ,请参阅SPA Blueprint文档。

另请参阅npm包: https://www.npmjs.com/package/@adobe/aem-spa-component-mapping

模型驱动的单页应用程序

利用AEM的Javascript SPA SDK的单页应用程序由模型驱动:

  1. 前端组件自行注册到组 件映射存储

  2. 然后 容器,一旦由模型提供者 提供了模型,就会迭代其模型内容( :items)。

  3. 对于页面,其子项() :children首先从组件映射中获取组件类 ,然后将 它实例化。

应用程序初始化

每个组件都通过的功能进行扩展 ModelProvider。 因此,初始化采用以下一般形式:

  1. 每个模型提供程序自行初始化,并监听对与其内部组件对应的模型片段所做的更改。

  2. 必须 以初始化 PageModelManager 流所表示的形式 初始化

  3. 存储后,页面模型管理器将返回应用程序的完整模型。

  4. 然后,此模型将传递给应用程序的前 端根容器 组件。

  5. 模型的片段最终传播到每个单独的子组件。

app_model_initialization

在此页面上