Как я могу добиться, чтобы все флажки в jsonschema были включены после того, как я установил переключатель? - PullRequest
Новая
       21

Как я могу добиться, чтобы все флажки в jsonschema были включены после того, как я установил переключатель?

0 голосов
/ 23 января 2019

Окей.У меня есть jsonschema, как показано ниже.Я пытаюсь получить все элементы (цвета - флажки) по умолчанию, если отмечен переключатель «ДА».Напротив, если нажать кнопку «НЕТ», все цвета будут сняты.

JsonSchema 

{
  "title": "Item Type Filtering Form",
  "description": "Form for filtering Item Types according to selected Attribute Values.",
  "type": "object",
  "properties": {
    "colorAll": {
      "type": "boolean",
      "title": "Seat Color All",
      "enum": [
        false,
        true
      ],
      "enumNames": [
        "NO",
        "YES"
      ],
      "default": true
    },
    "colorList": {
      "type": "array",
      "title": "Seat Color",
      "items": {
        "type": "object",
        "enum": [
          {
            "id": 1,
            "label": "RED"
          },
          {
            "id": 2,
            "label": "BLUE"
          },
          {
            "id": 3,
            "label": "GREEN"
          }
        ],
        "enumNames": [
          "RED",
          "BLUE",
          "GREEN"
        ]
      },
      "uniqueItems": true
    }
  }
}

UISchema 

{
  "colorAll": {
    "ui:widget": "radio",
    "ui:options": {
      "inline": true
    }
  },
  "colorList": {
    "ui:widget": "checkboxes",
    "ui:options": {
      "inline": true
    }
  }
}

Я практикую это на странице https://mozilla -services.github.io / реагировать-jsonschema-form / # но ни одна из моих попыток не являетсяработая так, как я описал выше ...

Я думал, что могу сделать это с ключевым словом "default:" и поместить в него все значения -> JsonSchema является действительным, но это не такне работает.

Может ли кто-нибудь помочь мне с этим?

Ответы [ 2 ]

0 голосов
/ 13 мая 2019

Чтобы изменить выбранные по умолчанию значения, вам нужно использовать свойство onChange формы (https://react -jsonschema-form.readthedocs.io / en / latest / # form-data-changes ) и обрабатывайте эту логику самостоятельно. Таким образом, вы можете проверить, был ли переключатель переключен в true или false, и если так, установите colorList в 

[
    {
        "id": 1,
        "label": "RED"
    },
    {
        "id": 2,
        "label": "BLUE"
    },
    {
        "id": 3,
        "label": "GREEN"
    }
]

или [] соответственно.

Обратите внимание на следующее предупреждение в документе:
WARNING: If you have situations where your parent component can re-render, make sure you listen to the onChange event and update the data you pass to the formData attribute.

Вот пример кода, который я настроил для управления двумя свойствами:
https://codepen.io/anon/pen/VOjJmY
Также обратите внимание, что поскольку фактическим значением является объект, я думаю, что вы должны повторно использовать один и тот же объект (отсюда прямое использование schema.properties.colorList.items.enum).

Я думаю, что есть ошибка в React JSON Schema Form, потому что состояние пользовательского интерфейса флажков не обновляется в нужный жизненный цикл или что-то в этом роде. Состояние корректно обновляется, но я не могу отменить все / переключить все эффекты, чтобы они происходили в правильном состоянии, а вместо этого следует переключение ... Как при переходе от «ДА» -> «НЕТ» -> «ДА» "они все выключаются, а затем, переходя от" ДА "->" НЕТ ", они снова включаются ...

0 голосов
/ 01 февраля 2019

В настоящее время кажется невозможным 

{
  "title": "Schema dependencies",
  "description": "These samples are best viewed without live validation.",
  "type": "object",
  "properties": {
    "conditional": {
      "title": "Conditional",
      "$ref": "#/definitions/person"
    }
  },
  "definitions": {
    "person": {
      "title": "Person",
      "type": "object",
      "properties": {
        "colorAll": {
          "type": "string",
          "enum": [
            "No",
            "Yes"
          ],
          "default": "No"
        }
      },
      "required": [
        "colorAll"
      ],
      "dependencies": {
        "colorAll": {
          "oneOf": [
            {
              "properties": {
                "colorAll": {
                  "enum": [
                    "Yes"
                  ]
                },
                "colorList": {
                  "type": "array",
                  "title": "Seat Color",
                  "items": {
                    "type": "string",
                    "enum": [
                      "RED",
                      "BLUE",
                      "GREEN",
                      "Yes Only",
                      "ABC"
                    ]
                  },
                  "default": [
                    "RED",
                    "BLUE",
                    "Yes Only"
                  ],
                  "uniqueItems": true
                }
              }
            },
            {
              "properties": {
                "colorAll": {
                  "enum": [
                    "No"
                  ]
                },
                "colorList": {
                  "type": "array",
                  "title": "Seat Color",
                  "items": {
                    "type": "string",
                    "enum": [
                      "RED",
                      "BLUE",
                      "GREEN"
                    ]
                  },
                  "uniqueItems": true
                }
              }
            }
          ]
        }
      }
    }
  }
}

, если вы запустите вышеперечисленное на детской площадке, список цветов изменится, но он не выберет цвета по умолчанию.но если у вас есть colorList имеет автономный компонент, он выбирает по умолчанию.

...