2

我曾经在我的项目中使用jsonform,但现在我迁移到 react,所以我使用这个库(react-jsonschema-form)。在 jsonform 中,我可以在表单部分中有一些不在模式中的字段集。像这样 :

{
  "schema":
    {
      "firstName": {
      "type": "string",
      "title": "Is JSON Form useful?",
      }
    },
  "form": [
     {
      "key": "firstName",
      "type": "text",
     }, 
     {
      "title" : "this is non-schema",
      "type": "fieldset"
     }
   ]
}

你可以在jsonschema 游乐场测试它。请帮助我在react-jsonschema-form中执行类似上述代码的操作。我怎样才能有一些不在模式中但我想在 uiSchema 中显示它们的字段?

react-jsonschema-form 也有一个游乐场。您可以找到一个名为“日期”的字段。它在 uiSchema 中添加,但在 schema 部分中不存在。结果中也没有显示该字段。我不知道如果它不存在他们为什么要使用它!!!!

谢谢。

4

1 回答 1

1

日期只是uiSchema的一个例子,playground这次就不用它了。这里我创建一个例子来帮助理解。

JSONSchema

{
  "title": "An example form",
  "description": "A simple form example",
  "type": "object",
  "required": [
    "firstName",
    "lastName"
  ],
  "properties": {
    "firstName": {
      "type": "string",
      "title": "First name"
    },
    "age": {
      "type": "integer",
      "title": "Age"
    },
    "telephone": {
      "type": "string",
      "title": "Telephone",
      "minLength": 10
    },
    "date": {
      "type": "string",
      "title": "Date"
    }
  }
}

UISchema

{
  "firstName": {
    "ui:autofocus": true,
    "ui:emptyValue": ""
  },
  "age": {
    "ui:widget": "updown",
    "ui:title": "Age of person",
    "ui:description": "(earthian year)"
  },
  "date": {
    "ui:widget": "alt-datetime"
  },
  "telephone": {
    "ui:options": {
      "inputType": "tel"
    }
  }
}

JSONSchema中有四个属性:firstName、age、telephone、date。而UISchema中有四个:firstName、age、telephone、date。它们是相同的。JSONSchema中的每一个在UISchema中都有一个或更少。JSONSchema中的类型就像string,在字符串中有一些子选项,例如“updown”。我们在 ui:ui:widget(UISchema) 中设置它。这是我的结果。底部元素是您提到的日期。 在此处输入图像描述

于 2018-10-28T11:11:58.423 回答