Properties
disabled: PropTypes.bool,
direction: PropTypes.oneOf(['up', 'down', 'left', 'right']),
group: PropTypes.bool,
isOpen: PropTypes.bool,
tag: PropTypes.string,
toggle: PropTypes.func
};
DropdownToggle.propTypes = {
caret: PropTypes.bool,
disabled: PropTypes.bool,
onClick: PropTypes.func,
'data-toggle': PropTypes.string,
};
<ButtonDropdown isOpen={isOpen} toggle={toggle}>
<Button id="caret" color="primary">{this.props.text}</Button>
<DropdownToggle caret color="primary" />
<DropdownMenu>
<DropdownItem header>Header</DropdownItem>
<DropdownItem disabled>Action</DropdownItem>
<DropdownItem>Another Action</DropdownItem>
<DropdownItem divider/>
<DropdownItem>Another Action</DropdownItem>
</DropdownMenu>
</ButtonDropdown>
import React from 'react';
export default function Example () => {
return (
<UncontrolledButtonDropdown>
<DropdownToggle caret>
Dropdown
</DropdownToggle>
<DropdownMenu>
<DropdownItem header>Header</DropdownItem>
<DropdownItem disabled>Action</DropdownItem>
<DropdownItem>Another Action</DropdownItem>
<DropdownItem divider />
<DropdownItem>Another Action</DropdownItem>
</DropdownMenu>
</UncontrolledButtonDropdown>
}