SAP 电商云 Spartacus UI 的 Product Category Navigation UI 实现(2)

简介: SAP 电商云 Spartacus UI 的 Product Category Navigation UI 实现

在 Backoffice,Navigation Node 的名称:Electronics Site


类型:CMSNavigationNode


image.png


id:ElectronicsNavNode


image.png


有三个子 navigation node:


image.png

分配到一个 Link Component 上:

image.png



三个子节点的信息能够看见:


image.png

categories 的子节点:

image.png

image.png




以 sony link 为例:


image.png

image.png

image.png



他也是一个 navigation entry:


image.png


其 entry 在另一个模型里:


image.png


这个模型的类型就是 navigation node entry:


image.png


关联到一个 Sony Link Component 上:


image.png

image.png


这个 Component 有 url 和 category 属性:


image.png


它是一个 CMSLinkComponent:



image.png

image.png


这些 Component 的用途在 SAP 官网能够找到。


站点上的顶部导航菜单通过以下 CMS 组件的配置进行控制:


  • NavigationComponents - 这些组件代表导航栏的各个部分。 每个部分可以有一个 CMSLinkComponent 对象和一个 CMSNavigationNode 对象,被认为是根节点。

  • CMSNavigationNodes - 这些组件代表导航树的结构,并具有在下拉菜单中呈现的标题。 每个结构可以有许多 CMSLinkComponent 对象和许多子 CMSNavigationNodes 对象。

  • CMSLinkComponents - 这些组件在页面上呈现并显示在导航树中的每个点。


相关文章
SAP 电商云 Spartacus UI Configurable Product 的页面设置(3)
SAP 电商云 Spartacus UI Configurable Product 的页面设置
SAP 电商云 Spartacus UI Configurable Product 的页面设置(2)
SAP 电商云 Spartacus UI Configurable Product 的页面设置
SAP 电商云 Spartacus UI Configurable Product 的页面设置(1)
SAP 电商云 Spartacus UI Configurable Product 的页面设置(1)
|
XML 测试技术 区块链
SAP 电商云 Spartacus UI Configurable Product 的页面设置(1)
SAP 电商云 Spartacus UI Configurable Product 的页面设置
|
运维 监控 Kubernetes
SAP MTA 里定义 SAP UI5 module 的一个例子
SAP MTA 里定义 SAP UI5 module 的一个例子
|
XML JSON 数据格式
SAP UI5 XML 视图中数据绑定路径语法的难点和易混淆点的专题讲解
SAP UI5 XML 视图中数据绑定路径语法的难点和易混淆点的专题讲解
|
JavaScript 前端开发
SAP UI5 里 FlexBox 控件使用的一个例子
SAP UI5 里 FlexBox 控件使用的一个例子
|
前端开发
关于 SAP UI5 应用 render2 实例异步创建的编码实现(2)
关于 SAP UI5 应用 render2 实例异步创建的编码实现
关于 SAP UI5 应用 render2 实例异步创建的编码实现(1)
关于 SAP UI5 应用 render2 实例异步创建的编码实现
|
XML JavaScript 前端开发
SAP UI5 的数据绑定语法概述
SAP UI5 的数据绑定语法概述