扩展ContextHub

当提供的ContextHub存储和模块不符合您的解决方案要求时,定义新的ContextHub存储和模块类型。

创建自定义存储候选项

ContextHub存储区是从注册的存储候选区创建的。 要创建自定义商店,您需要创建和注册商店候选。

包含创建和注册存储候选项的代码的javascript文件必须包含在客户端库文件夹中。 文件夹的类别必须与以下模式匹配:

contexthub.store.[storeType]

类别的[storeType]部分是注册存储候选项的storeType。 (请参阅注册ContextHub存储候选项)。 例如,对于contexthub.mystore的storeType,客户端库文件夹的类别必须为contexthub.store.contexthub.mystore

创建ContextHub存储候选

要创建存储候选项,请使用ContextHub.Utils.inheritance.inherit函数扩展其中一个基本存储:

请注意,每个基本存储扩展ContextHub.Store.Core存储。

以下示例创建ContextHub.Store.PersistedStore存储候选项的最简单扩展:

myStoreCandidate = function(){};
ContextHub.Utils.inheritance.inherit(myStoreCandidate,ContextHub.Store.PersistedStore);

实际上,您的自定义存储候选者将定义其他函数或覆盖存储的初始配置。 在/libs/granite/contexthub/components/stores下的存储库中安装了多个示例存储候选。 要从这些范例中学习,请使用CRXDE Lite打开javascript文件。

注册ContextHub存储候选项

注册一个存储候选项以将其与ContextHub框架集成,并允许从它创建存储。 要注册存储候选项,请使用ContextHub.Utils.storeCandidates类的registerStoreCandidate函数。

注册商店候选项时,请提供商店类型的名称。 从候选者创建商店时,您使用商店类型来标识其所基于的候选者。

注册商店候选项时,请指明其优先级。 当使用与已注册的存储候选者相同的存储类型来注册存储候选者时,使用具有较高优先级的候选者。 因此,您可以使用新的实施来覆盖现有的存储候选。

ContextHub.Utils.storeCandidates.registerStoreCandidate(myStoreCandidate,
                                'contexthub.mystorecandidate', 0);

在大多数情况下,只有一个候选者是必需的,并且优先级可以设置为0,但如果您感兴趣,您可以了解关于更多高级注册的信息,允许根据javascript条件(applies)和候选优先级选择少数存储实现之一。

创建ContextHub UI模块类型

当与ContextHub](/docs/experience-manager-64/sites-developing/ch-samplemodules.html?lang=zh-Hans)一起安装的[模块类型不符合您的要求时,创建自定义UI模块类型。 要创建UI模块类型,请通过扩展ContextHub.UI.BaseModuleRenderer类,然后向ContextHub.UI注册它来创建新的UI模块渲染器。

要创建UI模块渲染器,请创建一个Class对象,其中包含渲染UI模块的逻辑。 您的课程至少必须执行以下操作:

  • 扩展ContextHub.UI.BaseModuleRenderer类。 此类是所有UI模块渲染器的基本实现。 Class对象定义一个名为extend的属性,该属性用于将此类命名为正在扩展的类。

  • 提供默认配置。 创建defaultConfig属性。 此属性是一个对象,其中包括为contexthub.base UI模块定义的属性以及您需要的任何其他属性。

ContextHub.UI.BaseModuleRenderer的源位于/libs/granite/contexthub/code/ui/container/js/ContextHub.UI.BaseModuleRenderer.js。 要注册呈示器,请使用ContextHub.UI类的registerRenderer方法。 您需要为模块类型提供名称。 管理员根据此呈现器创建UI模块时,会指定此名称。

在自执行匿名函数中创建并注册呈示器类。 以下示例基于contexthub.browserinfo UI模块的源代码。 此UI模块是ContextHub.UI.BaseModuleRenderer类的简单扩展。

;(function() {

    var SurferinfoRenderer = new Class({
        extend: ContextHub.UI.BaseModuleRenderer,

        defaultConfig: {
            icon: 'coral-Icon--globe',
            title: 'Browser/OS Information',

            storeMapping: {
                surferinfo: 'surferinfo'
            },

            template:
                '<p>{{surferinfo.browser.family}} {{surferinfo.browser.version}}</p>' +
                '<p>{{surferinfo.os.name}} {{surferinfo.os.version}}</p>'
        }
    });

    ContextHub.UI.registerRenderer('contexthub.browserinfo', new SurferinfoRenderer());

}());

包含创建和注册呈示器的代码的javascript文件必须包含在客户端库文件夹中。 文件夹的类别必须与以下模式匹配:

contexthub.module.[moduleType]

类别的[moduleType]部分是模块渲染器注册时使用的moduleType。 例如,对于contexthub.browserinfomoduleType,客户端库文件夹的类别必须为contexthub.module.contexthub.browserinfo

在此页面上

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now