Question

在创建羊驼形态的过程中，我遇到了一种我不确定如何进行的情况。

以下是我正在使用的架构的表示：

$("#samplediv").alpaca({
  "schema": {
    "description": "My Favorite Ice Creams",
    "type": "array",
    "items": {
        "title": "Ice Cream",
        "type": "object",
        "properties": {
            "flavor": {
                "title": "Flavor",
                "description": "Ice cream flavor",
                "type": "string"
            },
            "topping": {
                "title": "Topping",
                "description": "Ice cream topping",
                "type": "string"
            }
        }
    }
  }
});

渲染的架构如下所示：

我有一个由文本字段组成的对象数组。我的目标是根据对象包含的数据为数组中的每个对象创建一个动态且独立的标题。在示例中，这可能会取代冰淇淋＆＃39;标题为＆＃39;香草＆＃39;对于第一个对象，＆＃39;巧克力＆＃39;对于第二个对象。

我已尝试使用 postRender 回调根据当前字段数据设置数组容器中每个对象的title属性，但我似乎无法获取文本更新。

Answer 1

您可以通过执行某些操作来实现此目的，但默认情况下，Array类型的字段通常对创建的每个项使用相同的标题。您需要做的是在更改Flavor字段后更改标题，这将通过在该字段中使用change事件来完成。

"flavor": {
      "events": {
        "change": function() {
          changeItemLabel(this.parent, this.getValue());
        }
      }
    }

这样可以解决问题，但所有新创建的项目都会有相同的更新标题！因此，想到的想法是使用一种默认标签并覆盖新创建项目的更新标题。

这里有一个fiddle来证明这个案子。我希望这可以帮助你，但告诉我这是不是你想要的。

Answer 2

不幸的是，Alpacajs文档非常混乱，没有描述一些功能。而且其中一些示例不起作用。因此，您必须深入研究源代码以了解其工作原理。：（

要启用折叠功能，您必须将代码放在选项的“项目”部分内，如下所示：

"options": {
    "myfield": {
        "toolbarSticky": true,
        "toolbarPosition": "bottom",
        "type": "array",
        "items": {
            "collapsible": true,
            "fields": {
            }
        }
    }
}

数组中每个对象的动态独立标题

2 个答案: