Использование anyOf для просмотра имени объекта?

У меня есть схема, в которой я хотел бы иметь раскрывающийся список, чтобы выбрать параметр, а оттуда - в зависимости от выбора появляются разные параметры; все они вложены в массив, чтобы их было кратно.

Я заметил, что когда я заполняю фиктивные данные, выходной json не сохраняет имя выбранного параметра.

поэтому data.json выглядит примерно так:

{
  "page1": [
    {
      "imageOptions": {
        "imageHeightType": "vh",
        "imageHeight": 50
      },
      "textboxArea": {
        "headerText": "Header for selection1",
        "headingTag": "h1",
        "textBoxOpacity": 15
      }
    },
    {
      "content": "This is a complety different selection, yet there is no name to tell the difference between these two difference objects"
    }
  ]
}

Как видите, нет объекта для переноса этих двух разных элементов в массив page1. В идеале хотелось бы что-то вроде:

{
  "page1": [
    {
     // Title of object goes here from schema
      "imageOptions": {
        "imageHeightType": "vh",
        "imageHeight": 50
      },
      "textboxArea": {
        "headerText": "Header for selection1",
        "headingTag": "h1",
        "textBoxOpacity": 15
      }
    },
    {
      // Title of object goes here from schema
      "content": "This is a completely different selection, yet there is no name to tell the difference between these two difference objects"
    }
  ]
}

Есть ли способ сделать это так? Я просмотрел документы для AnyOf, но мне не повезло. Совершенно новый для React-JsonSchema-Forms.

Ниже моя текущая схема:

{
  "type": "object",
  "properties": {
    "page1": {
      "type": "array",
      "items": {
        "type": "object",
        "anyOf": [
          {
            "title": "Full Width Image",
            "type": "object",
            "properties": {
              "imageOptions": {
                "type": "object",
                "title": "Image",
                "properties": {
                  "image": {
                    "type": "string",
                    "title": "Image",
                    "format": "data-url"
                  },
                  "imageHeightType": {
                    "enum": [
                      "px",
                      "vh"
                    ]
                  },
                  "imageHeight": {
                    "type": "number",
                    "title": "Image Height"
                  }
                }
              },
              "textboxArea": {
                "type": "object",
                "title": "Textbox Area",
                "properties": {
                  "headerText": {
                    "type": "string",
                    "title": "Heading Text"
                  },
                  "headingTag": {
                    "enum": [
                      "h1",
                      "h2",
                      "h3"
                    ]
                  },
                  "imageText": {
                    "type": "string",
                    "title": "Body Text"
                  },
                  "textboxPosition": {
                    "title": "Textbox Position",
                    "enum": [
                      "Left",
                      "Center",
                      "Right"
                    ]
                  },
                  "textboxColor": {
                    "title": "Color of Textbox Area",
                    "type": "string"
                  },
                  "textBoxOpacity": {
                    "title": "Textbox Opacity %",
                    "type": "integer",
                    "minimum": 0,
                    "maximum": 100,
                    "multipleOf": 5
                  }
                }
              }
            }
          },
          {
            "title": "Custom Block",
            "type": "object",
            "properties": {
              "content": {
                "type": "string"
              }
            }
          }
        ]
      }
    }
  }
}

Also Link to the online schema editor if it helps understand my issue


reactjs javascript react-jsonschema-forms
person Goralight    schedule 16.05.2019    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Почему бы просто не добавить свойство, похожее на имя, к каждому объекту? Затем вы можете скрыть/отключить его, если хотите:

схема:

"anyOf": [
    {
        "title": "Full Width Image",
        "type": "object",
        "properties": {
            "name": {
                "type": "string",
                "default": "fullWidthImage"
            },
            "imageOptions": {
                "type": "object",
                "title": "Image",
                "properties": {...}
                ...
            }
            ...
        }
    },
    {
        "title": "Custom Block",
        "type": "object",
        "properties": {
            "name": {
                "type": "string",
                "default": "custom"
            },
            "content": {
                "type": "string"
            }
        }
    }
]

uiСхема:

{
    "page1": {
    "items": {
        "name": {
            "ui:widget": "hidden"
        },
        "imageOptions": {...},
        ...
    }
}

formData тогда должен выглядеть так:

{
    "page1": [
        {
            "name": "fullWidthImage",
            "imageOptions": {
                "imageHeightType": "vh",
                "imageHeight": 50
            },
            "textboxArea": {
                "headerText": "Header for selection1",
                "headingTag": "h1",
                "textBoxOpacity": 15
            }
        },
        {
            "name": "custom",
            "content": "This is a complety different selection, yet there is no name to tell the difference between these two difference objects"
        }
    ]
}
person mirage    schedule 18.05.2019
comment
А по умолчанию работает? при использовании его на игровой площадке он фактически не обновляет данные json. или это ошибка на игровой площадке и нормально работает при использовании? - person Goralight; 19.05.2019
comment
О... Я только что увидел это: github.com/mozilla-services /react-jsonschema-form/issues/975 Значение по умолчанию работает (вы можете увидеть простой пример на игровой площадке), но я предполагаю, что это ошибка обработки anyOf/oneOf... =( - person mirage; 20.05.2019
comment
Теперь это работает с версии 1.7.0 — github. com/mozilla-services/react-jsonschema-form/releases/tag/ - person Goralight; 21.07.2019