Spartacus storefront 如何替换SiteContextSlot内容?

Spartacus storefront 如何替换SiteContextSlot内容?,spartacus-storefront,Spartacus Storefront,我想将spartacus中的语言和货币选择器替换为我自己的语言和货币选择器,并添加更多内容。问题是我无法cxOutletRef站点上下文插槽。我不能重写LanguageComponent和CurrencyComponet,如果可以,我不想使用语言-货币,而是货币-语言。所以我真正需要知道的是如何更改SiteContextSlot 提前谢谢 您可以使用Spartacus的cmsComponentsconfig覆盖此CMS组件。见文件 cms映射配置中使用的组件名称是LanguageCurrency

我想将spartacus中的语言和货币选择器替换为我自己的语言和货币选择器,并添加更多内容。问题是我无法cxOutletRef站点上下文插槽。我不能重写LanguageComponent和CurrencyComponet,如果可以,我不想使用语言-货币,而是货币-语言。所以我真正需要知道的是如何更改SiteContextSlot


提前谢谢

您可以使用Spartacus的
cmsComponents
config覆盖此CMS组件。见文件


cms映射配置中使用的组件名称是
LanguageCurrencyComponent
(或
CMSSiteContextComponent
,具体取决于您的实际cms数据)。

cms中定义了
SiteContext
插槽(不是“SiteContextSlot”btw),默认情况下它包含两个组件。两者都属于
CMSSiteContextComponent
类型。
CMSSiteContextComponent
有一个属性(“上下文”)来定义实际上下文

上下文由
SiteContextSelectorComponent
拾取,它将逻辑委托给
SiteContextComponentService
SiteContextComponentService
使用通用方法在select元素中加载上下文列表

如果要更改
站点上下文中的顺序或上下文选择器,我建议您执行以下操作:

  • 只需更改CMS中
    SiteContextSlot
    内组件的顺序即可更改顺序
  • 删除上下文;只需从
    SiteContextSlot
  • 添加自定义上下文(组件)
添加新上下文有不同的选项: -添加
站点上下文选择器组件的新实例。这相当复杂,因为您需要在后端引入一个新上下文(只是一个枚举),并扩展
SiteContextComponentService
,以便可以使用新上下文。 -创建自己的上下文组件以呈现其他上下文 -创建自定义组件以呈现所有上下文(您需要替换
SiteContextSlot
中的所有组件并添加新组件)。 -完全忘记CMS,正如您所建议的,一起覆盖插槽。实际上,这在插座上工作得很好

您还可以混合和匹配上述选项:

  • 将现有组件保留在CMS中(但可能会重新排序)
  • 使用带有
    OutletPosition
    的插座,这样您就有了额外的组件
下面的代码显示了这段代码


更多上下文

谢谢@Platonn,但这些都不行。如果我在cms配置中使用CMSSiteContextComponent,它将复制我试图显示的内容,而不是删除语言和货币选择器,因为CMSSiteContextComponent中有2个组件。此外,如果我试图覆盖LanguageCurrencyComponent,它不会改变任何东西。我需要进一步挖掘映射
CMSSiteContextComponent
导致重复的原因。我希望您可以查看该组件原始实现的源代码,并推断如何避免重复渲染。这是原始模块,谢谢@Platonn,但复制的原因很清楚。SiteContextSlot中存在2个CMSSiteContextComponent(语言和货币)。如果我覆盖CMSSiteContextComponent,它将同时更改这两个组件。这种情况的另一个示例是CMSLinkComponent。如果我想更改SiteLinksSlot(查找存储、帮助、联系我们)中的内容,我不能覆盖CMSLinkComponent,因为我生成的HTML将显示3次(它将替换查找存储、帮助、联系我们)。很高兴听到,您最终使用了什么解决方案?你能“接受”这个答案并将其标记为完成吗?我最终覆盖了SiteContextSelector组件,因为我想改变它显示选择器的方式,然后我在使用新SiteContextSelector的地方创建了一个新组件(CurrencyLanguageUIComponent)。这样我就可以更改顺序(语言/货币到货币/语言)。最后,在app.component.html中,
。听起来不错。代替使用Outlook,您可能需要考虑组件映射。那有点干净。