Реализация флажков в опциях Select используя antd - PullRequest
0 голосов
/ 02 мая 2019

Я пытаюсь реализовать выбор, основанный на флажках, используя antd, но он не поддерживает его изначально.Я не хочу импортировать новую библиотеку, такую ​​как реагировать на выбор, только для этой цели.

Я включил флажок Checkbox внутри тега Option, но он не совсем работает.Я попытался настроить реквизиты onSelect и onDeselect с помощью методов addClass и removeClass, чтобы флажок устанавливался при щелчке в любом месте параметра и отменялся при повторном нажатии.Но это не только портит HTML, но и неэффективно.

Это код, который я написал для включения флажков в компоненте Select, предоставляемом Antd.

const children = [];
for (let i = 10; i < 16; i++) {
  children.push(
    <Option
      onSelect={handleSelect}
      className="disappear"
      key={i.toString(36) + i}
    >
      <Checkbox id={i.toString(36) + i}>{i.toString(36) + i}</Checkbox>
    </Option>
  );
}


<Select
          mode="tags"
          size={size}
          placeholder="Please select"
          onChange={handleChange}
          onSelect={handleSelect}
          onDeselect={handleDeselect}
          style={{ width: "100%" }}
        >
          {children}
        </Select>

Я ожидаю список флажковчтобы показать, когда я нажимаю на строку выбора antd, сейчас он показывает галочку для каждой опции.

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