Как я могу скрыть / показать заполнитель по умолчанию с помощью AntDesign React - PullRequest
0 голосов
/ 03 августа 2020

Я использую Ant Design для ввода в свой проект React. При выборе нескольких входов у меня есть сообщение заполнителя по умолчанию «Выберите вариант»

      {type === 'select' && (
        <Select
          className={isBlack}
          mode="multiple"
          key={inputKey}
          id={inputKey}
          defaultValue={value}
          disabled={isFixed}
        >
          {!isBlack && (
            <Option
              value=""
              selected
              disabled
              hidden
            >
              <span>Select an option</span>

            </Option>
          )}
          {options.map((option, i) => (
            <Option
              className="ant-drop"
              key={`option_${0 + i}`}
              value={option}
            >{option}
            </Option>
          ))}
        </Select>
      )}

Однако после того, как все параметры выбраны в раскрывающемся списке, я не могу понять, как скрыть «Выбрать» сообщение "Вариант" после того, как больше нет вариантов для сопоставления. На верхнем уровне я пытался использовать if value === null, а затем возвращать раскрывающийся список без данных, но я думаю, что это не имеет смысла, потому что технически я бы дважды отображал раскрывающийся список. Я не уверен, куда отсюда go. Любая помощь будет принята с благодарностью.

1 Ответ

0 голосов
/ 03 августа 2020

Надеюсь, я правильно понимаю и без особого контекста, не могли бы вы попробовать следующее:

  • Показать Select an Option с большим количеством
  • Предполагая, что когда пользователь выберет вариант, вы обновляете состояние или что-то обновляете. Когда вы обновляете это состояние / переменную, мы можем быть уверены, что скроем параметр по умолчанию.

Таким образом, этот параметр будет отображаться следующим образом:

{(!isBlack && userAnswered) (
        <Option
          value=""
          selected
          disabled
          hidden
        >
          <span>Select an option</span>

        </Option>
)}

Где userAnswered может например, const userAnswered = !!this.state.dropDownSelectAnswers.length.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...