窗口小部件数组字段和上下文“区域”字段

时间:2017-10-03 21:08:06

标签: apostrophe-cms

我有一个撇号cms小部件,其中包含以下设置:

module.exports = {
extend: 'apostrophe-widgets',
label: 'Content Tabs',
addFields: [{
    name: 'tabs',
    label: 'Tabs',
    type: 'array',
    titleField: 'tabTitle',
    schema: [{
        type: 'string',
        name: 'tabTitle',
        label: 'Title'
    },
    {
        type: 'area',
        name: 'tabContent',
        label: 'Content',
        contextual: true
    }
    ]
}]

}

现在,当我将此小部件添加到页面时,tabContent区域在没有加号的情况下呈现为空,因此我无法向其添加任何组件。

如果我将contextual设置为false,我可以添加内容,但不保存,因为没有触发保存事件(这就是我开始使用contextual集的原因首先到true

UPD:通过检查Apostrophe CMS的内部结构,我发现array字段没有实现任何逻辑来检测自己字段中的上下文字段。

有没有人知道如何让它发挥作用?

1 个答案:

答案 0 :(得分:2)

这是一个众所周知的问题:

https://github.com/punkave/apostrophe/issues/993

解决方法是在窗口小部件的对话框中以非上下文方式编辑这些区域。如果您没有设置上下文标志并且您确实为架构配置中的区域提供了完整选项,那么会发生这种情况。

我们希望将来能够对嵌套在数组中的区域进行上下文编辑。 github问题中描述了一些棘手的方面。

然而,您可能会喜欢另一种选择:

  1. 定义一个"标签"小部件(注意它是单数 - 只有一个标签)。此选项卡小部件具有标题和内容区域,就像在示例中一样。

  2. 定义一个"标签"小部件。在该窗口小部件中,您只有一个架构字段:仅包含area窗口小部件的嵌套tab。设为contextual: true

  3. 添加"标签"小部件到您的模板。胜利!

  4. 这里我们使用嵌套区域而不是数组。嵌套区域的上下文编辑在Apostrophe中得到了很好的支持。

    现在通过使用拖放或箭头重新排序小部件来完成对标签等顺序的编辑。如果您使用JavaScript隐藏除了"活动"之外的所有内容。选项卡这对您来说不起作用。但是,您可以根据用户是否具有tabs小部件的编辑权限来使该JavaScript成为条件。如果他们这样做,您只需显示该区域中的所有小部件,以便可以重新排序,添加新标签等等。