Question

我正在尝试使用react-jsonschema形式的mozilla this

我的jsonschema是

{
  "definitions": {
    "address": {
      "type": "object",
      "properties": {
        "street_address": {
          "type": "string"
        },
        "city": {
          "type": "string"
        },
        "state": {
          "type": "string"
        }
      },
      "required": [
        "street_address",
        "city",
        "state"
      ]
    },
    "node": {
      "type": "object",
      "properties": {
        "name": {
          "type": "string"
        },
        "children": {
          "type": "array",
          "items": {
            "$ref": "#/definitions/node"
          }
        }
      }
    }
  },
  "type": "object",
  "properties": {
    "billing_address": {
      "title": "Billing address",
      "$ref": "#/definitions/address"
    },
    "shipping_address": {
      "title": "Shipping address",
      "$ref": "#/definitions/address"
    },
    "tree": {
      "title": "Recursive references",
      "$ref": "#/definitions/node"
    }
  }
}

UiSchema

{
  "ui:order": [
    "shipping_address",
    "billing_address",
    "tree"
  ]
}

使用重新排序我可以控制ui上的控件的顺序，但由于送货地址有街道地址，城市和州。如何控制ui：这些控件的顺序，考虑我希望城市首先出现在送货地址中我怎么能用mozilla做反应jsonschema形式

有人可以帮我这个

Answer 1

您可以在送货地址级别添加订单。

{
  "shipping_address": {
    "ui:order": [
      "city",
      "*"
    ]
  },
  "ui:order": [
    "shipping_address",
    "billing_address",
    "tree"
  ]
}

Answer 2

尝试使用@ ver01 / form here

具有以下模式：

{
"definitions": {
    "address": {
        "type": "object",
        "properties": {
            "street_address": {
                "title": "street_address",
                "type": "string"
            },
            "city": {
                "title": "city",
                "type": "string"
            },
            "state": {
                "title": "state",
                "type": "string"
            }
        },
        "required": [
            "street_address",
            "city",
            "state"
        ]
    },
    "node": {
        "type": "object",
        "properties": {
            "name": {
                "title": "name",
                "type": "string"
            },
            "children": {
                "title": "children",
                "type": "array",
                "items": {
                    "$ref": "#/definitions/node"
                }
            }
        }
    }
},
"type": "object",
"properties": {
    "billing_address": {
        "title": "Billing address",
        "$ref": "#/definitions/address"
    },
    "shipping_address": {
        "title": "Shipping address",
        "$ref": "#/definitions/address",
        "$vf_opt": {
            "option": {
                "order": [
                    "city",
                    "*"
                ]
            }
        }
    },
    "tree": {
        "title": "Recursive references",
        "$ref": "#/definitions/node"
    }
},
"$vf_opt": {
    "option": {
        "order": [
            "shipping_address",
            "billing_address",
            "tree"
        ]
    }
}

使用mozilla反应形式重新排序表单控件

2 个答案: