React Simple Dropdown
Non-prescriptive React.js dropdown toolkit.
npm install react-simple-dropdown
How to use
This module provides three React components that you can use as a basis for any kind of dropdown menu:
DropdownTrigger: The element that will cause your dropdown to appear when clicked.
DropdownContent: Contains the "filling" of your dropdown. Generally, this is a list of links.
Dropdown: The base element for your dropdown. This contains both the
DropdownContent, and handles communication between them.
There is also a barebones stylesheet which must be included in order for the component to actually work.
Keep in mind that
DropdownContent must be direct children of
Dropdown. Here's a quick example:
var React = ;var Dropdown = ;var DropdownTrigger = DropdownDropdownTrigger;var DropdownContent = DropdownDropdownContent;var Menu = React;
Options can be passed to
Dropdown as props. A list of available options can be found below. These must be passed to the containing
|active||boolean||Manually show/hide the
|disabled||boolean||Disable toggling of the dropdown by clicking on
|onShow||function||Callback for when
|onHide||function||Callback for when
Each instance of
Dropdown has some methods developers might find useful.
|show||Shows the dropdown.|
|hide||Hides the dropdown.|
|isActive||Returns a boolean indicating whether or not the dropdown is active.|