SPA的動態模型到元件映射

本檔案說明Javascript SPA SDK for AEM中如何進行動態模型與元件對應。

元件映射模組

ComponentMapping模組作為NPM包提供給前端項目。 它可儲存前端元件，並為「單頁應用程式」提供將前端元件對應至AEM資源類型的方式。 如此可在剖析應用程式的JSON模型時，啟用元件的動態解析度。

模型中的每個項目都包含一個:type欄位，可顯示AEM資源類型。 當裝載時，前端元件可以使用它從基礎庫接收到的模型片段進行自身渲染。

有關模型解析和對模型的前端元件訪問的詳細資訊，請參閱SPA Blueprint文檔。

另請參閱npm套件：https://www.npmjs.com/package/@adobe/aem-spa-component-mapping

模型驅動的單頁應用程式

「單頁應用程式」運用Javascript SPA SDK for AEM是模型導向：

1. 前端元件自行註冊到元件映射儲存。

2. 然後，容器一旦由模型提供者提供模型，就會重複其模型內容(:items)。

3. 在頁面中，其子代(:children)首先從元件映射獲取元件類，然後實例化它。

應用程式初始化

每個元件都擴展了 ModelProvider的功能。 因此，初始化採用以下一般形式：

1. 每個模型提供器都自行初始化，並偵聽對與其內部元件相對應的模型段所做的更改。

2. PageModelManager必須初始化為初始化流。

3. 儲存後，頁面模型管理員會傳回應用程式的完整模型。

4. 然後，此模型會傳遞至應用程式的前端根Container元件。

5. 模型的段最終會傳播到每個單獨的子元件。