Использование выпадающего меню в React

Question

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

TypeError: Reaction_dropdown__WEBPACK_IMPORTED_MODULE_6 __. Выпадающий список не определен

Вот мой код:

render() {
return (
  <div className="Upload">
    {this.renderNotes()}
    <Dropdown>
      <Dropdown.Toggle variant="success" id="dropdown-basic">
        Dropdown Button
      </Dropdown.Toggle>

      <Dropdown.Menu>
        <Dropdown.Item href="#/action-1">Action</Dropdown.Item>
        <Dropdown.Item href="#/action-2">Another action</Dropdown.Item>
        <Dropdown.Item href="#/action-3">Something else</Dropdown.Item>
      </Dropdown.Menu>
    </Dropdown>
  </div>

);

И импорт:

import { Dropdown } from "react-dropdown";

Я установил его с помощью команды: npm install react-dropdown --save

РЕДАКТИРОВАТЬ: я должен был использовать import Dropdown from "react-dropdown";
Но сейчас сайт компилируется, а список не отображается ...

Answer 1

Вы пытаетесь импортировать именованный экспорт . Однако react-dropdown экспортирует этот модуль как по умолчанию . импортировать это так

import Dropdown from 'react-dropdown'

также убедитесь, что вы импортируете стили для этого компонента

import 'react-dropdown/style.css'