dropdown ui component for react
npm install rc-dropdownreact dropdown component
[![NPM version][npm-image]][npm-url] [![build status][travis-image]][travis-url] [![Test coverage][coveralls-image]][coveralls-url] [![Dependencies][david-image]][david-url] [![DevDependencies][david-dev-image]][david-dev-url] [![npm download][download-image]][download-url] [![bundle size][bundlephobia-image]][bundlephobia-url] [![dumi][dumi-image]][dumi-url]
[npm-image]: http://img.shields.io/npm/v/rc-dropdown.svg?style=flat-square
[npm-url]: http://npmjs.org/package/rc-dropdown
[travis-image]: https://img.shields.io/travis/react-component/dropdown.svg?style=flat-square
[travis-url]: https://travis-ci.org/react-component/dropdown
[coveralls-image]: https://img.shields.io/coveralls/react-component/dropdown.svg?style=flat-square
[coveralls-url]: https://coveralls.io/r/react-component/dropdown?branch=master
[david-url]: https://david-dm.org/react-component/dropdown
[david-image]: https://david-dm.org/react-component/dropdown/status.svg?style=flat-square
[david-dev-url]: https://david-dm.org/react-component/dropdown?type=dev
[david-dev-image]: https://david-dm.org/react-component/dropdown/dev-status.svg?style=flat-square
[download-image]: https://img.shields.io/npm/dm/rc-dropdown.svg?style=flat-square
[download-url]: https://npmjs.org/package/rc-dropdown
[bundlephobia-url]: https://bundlephobia.com/result?p=rc-dropdown
[bundlephobia-image]: https://badgen.net/bundlephobia/minzip/rc-dropdown
[dumi-image]: https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square
[dumi-url]: https://github.com/umijs/dumi
online example: http://react-component.github.io/dropdown/examples/
``js`
var Dropdown = require('rc-dropdown');
// use dropdown
| name | type | default | description |
|---|---|---|---|
| overlayClassName | String | additional css class of root dom node | |
| openClassName | String | ${prefixCls}-open | className of trigger when dropdown is opened |
| prefixCls | String | rc-dropdown | prefix class name |
| transitionName | String | dropdown menu's animation css class name | |
| animation | String | part of dropdown menu's animation css class name | |
| placement | String | bottomLeft | Position of menu item. There are: top, topCenter, topRight, bottomLeft, bottom, bottomRight |
| onVisibleChange | Function | call when visible is changed | |
| visible | boolean | whether tooltip is visible | |
| defaultVisible | boolean | whether tooltip is visible initially | |
| overlay | rc-menu | rc-menu element | |
| onOverlayClick | function(e) | call when overlay is clicked | |
| minOverlayWidthMatchTrigger | boolean | true (false when set alignPoint) | whether overlay's width must not be less than trigger's |
| getPopupContainer | Function(menuDOMNode): HTMLElement | () => document.body | Where to render the DOM node of dropdown |
Note: Additional props are passed into the underlying rc-trigger component. This can be useful for example, to display the dropdown in a separate portal-driven window via the getDocument() rc-trigger prop.
`bash`
npm install
npm start
`bash`
npm test
npm run chrome-test
`bash``
npm run coverage
open coverage/ dir
rc-dropdown is released under the MIT license.