使用 JSON 表单模式放置条件元素

Question

我正在修改 Mozillas JSON 网络表单工具 react-jsonschema-form [1] 并努力定义条件单元格的位置。

考虑使用流程的简单形式：

|- item1 
|---conditionalitem
|- item2

我想做的是使用 JSON 模式来创建条件逻辑，以便在某些条件满足时呈现一些中间组件。我已经完成了这个并创建了一个小演示来查看 [2]。使用此逻辑，如果第一个 select 组件中的选项 select 为 option2，则将呈现第二个组件。

然而，我想要的是在 item1 和 item2 之间呈现的条件组件。这可以通过在 dependency 对象内附加 item2 来实现，但我希望 item2 呈现而不考虑任何条件逻辑。如何实现这一目标？

提前致谢。

Answer 1

是的。您可以控制项的呈现顺序。这可以在您的 uiSchema 中配置。只需在 uiSchema

中添加以下行

"ui:order": ["item1", "item2","item1conditional"]

因此您 App.js 中的 uiSchema 将变为

const uiSchema = {
 "ui:order": ["item1", "item2","item1conditional"],
 description: {
   "ui:widget": "textarea",
   classNames: "foo"
 }
};

确保将以后添加的所有项目都添加到此，否则会引发错误。

Placement of conditional elements using JSON form schemas