Выпадающий список Reactstrap без кнопки выбора или - PullRequest
Новая
       10

Выпадающий список Reactstrap без кнопки выбора или

0 голосов
/ 10 января 2020

Я пытаюсь построить меню. Примерно так:

enter image description here Я планирую использовать простое выпадающее меню из bootstrap. Однако я не уверен, как это сделать. В моем методе рендеринга функции класса есть следующее: 

<td style={{ width: 20, cursor: "pointer" }}>
  <Dropdown
    toggle={this.toggleMenu}
    isOpen={this.state.dropdownOpen}
  >
    <div>&bull;&bull;&bull;</div>
    <DropdownMenu>
      <DropdownItem>10</DropdownItem>
      <DropdownItem>25</DropdownItem>
      <DropdownItem>50</DropdownItem>
      <DropdownItem>100</DropdownItem>
    </DropdownMenu>
  </Dropdown>
</td>

И у меня есть следующие события / переменные: 

  constructor(props) {
    super(props);

    this.toggleMenu = this.toggleMenu.bind(this);
    this.state = {
      collapse: false,
      fadeIn: true,
      timeout: 300,
      dropdownOpen: false,
      debug: ""
    };
  }

  toggleMenu(e) {
    alert("sds");
    this.setState({
      dropdownOpen: !this.state.dropdownOpen
    });
  }

Я не получаю никаких ошибок, и toggleMenu никогда не вызывается. Я что-то здесь упускаю?

Если я использую DropDownToggle, он добавляет кнопку: enter image description here

1 Ответ

0 голосов
/ 18 апреля 2020

Вместо 

<div>&bull;&bull;&bull;</div>

попробуйте использовать компонент DropdownToggle вместе со свойством 'tag', например так: 

<DropdownToggle tag="text">&bull;&bull;&bull;</DropdownToggle>
...