AlpacaJS：动态表行中的可观察引用字段

Question

我有一个表格元素，人们可以在其中添加行来添加数据。其中两个字段是互斥的：如果在一个字段中输入值，则应禁用另一个字段，反之亦然。我的理解是，我需要使用可观察量在回调中执行此操作，但我似乎找不到正确的路径或ID字符串。从逻辑上讲，它是如何工作的没有多大意义。该表开始时为空。postRender那么，是否有对“添加行”按钮的回调或我需要添加此逻辑的内容？任何指导将不胜感激。图式：    var schema = {        "type": "object",        "properties": {            "cbnum": {                "type": "string",                "required": true,                "minLength": 5,                "maxLength": 5            },            "projects": {                "type": "array",                "items": {                    "type": "object",                    "properties": {                        "name": {                            "type": "string",                            "title": "Project name (required)",                            "required": true                        },                        "tags": {                            "type": "string",                            "title": "Tags"                        },                        "hours": {                            "type": "number",                            "title": "Hours"                        },                        "percent": {                            "type": "number",                            "title": "Percent"                        }                    }                }            }        }    };下面的代码不起作用（再次，当你想到它时，这并不奇怪，但我不知道还能尝试什么）：    var postRenderCallback = function(control) {        var hours = control.childrenByPropertyId["projects"].childrenByPropertyId["hours"];        var percent = control.childrenByPropertyId["projects"].childrenByPropertyId["percent"];        hours.on("change", function() {            if (this.getValue().length > 0) {                percent.setValue("");                percent.options.disabled = true;            } else {                percent.options.disabled = false;            }        });    };

Answer 1

你的模式是正确的，你正在考虑的也是正确的，使用总是有帮助，但在这种情况下不要太多，因为你有喜欢嵌套的字段/对象（数组>项>项1>小时）这就是为什么你的代码不起作用，因为你不能将更改函数分配给所有创建项的所有小时！加上你正在使用一个数字（参见你的模式配置），这将永远不会起作用，你应该使用或正在字段上。postRendergetValue().lengthtoStringisNaNnumber

因此，要实现您正在寻找的内容，您应该创建一个并将其分配给羊驼选项字段。在此配置中，您应该使用“百分比”和“小时数”字段，并为每个字段输入您在 postRender 上已经执行的相同代码。options configchange event

下面是一个示例：

"hours": {

   "events": {

       "change": function() {

            var percent = this.parent.childrenByPropertyId["percent"];

            var hoursValue = this.getValue();

            if (typeof hoursValue != 'undefined' && !isNaN(hoursValue)) {

              percent.options.disabled = true;

            } else {

              percent.options.disabled = false;

            }

            percent.refresh();

        }

    }

}

您已经有一个全局控件变量，可用于获取字段控件对象，但这里我们在子控件上，因此我们可以使用父控件执行此操作，如下所示：postRender

var percent = this.parent.childrenByPropertyId["percent"];

在小时数或百分比字段中设置任何选项后，您应该调用函数来告诉羊驼您更新了某些配置，并使用更新的配置为我们重新呈现该字段。refresh()

percent.refresh();

这是此解决方案的工作小提琴。

为了回答您关于“添加行”按钮的问题，是的，有一个回调，但我认为它不会对您有所帮助，我尝试了，使用数组类型字段，您有2个不同的添加按钮，所以对我来说这不是一个好的解决方案，因为您应该为两个按钮实现代码！第一个在有 0 个项目时（工具栏按钮），第二个在开始添加项目时（操作按钮）。