rc-menu

What is rc-menu?

The rc-menu package is a React component for building menus. It provides a flexible and accessible way to create dropdown, context, and other types of menus in your web application. It supports features like keyboard navigation, animation, and customization through themes.

What are rc-menu's main functionalities?

Basic Menu

This code sample demonstrates how to create a basic menu with three options. When an option is selected, it logs the key of the selected item.

import Menu, { Item as MenuItem } from 'rc-menu';

<Menu onSelect={({ key }) => console.log(key)}>
  <MenuItem key="1">Option 1</MenuItem>
  <MenuItem key="2">Option 2</MenuItem>
  <MenuItem key="3">Option 3</MenuItem>
</Menu>

Sub Menu

This example shows how to create a menu with a sub-menu. The sub-menu contains two options, demonstrating how to nest menus within each other.

import Menu, { SubMenu, Item as MenuItem } from 'rc-menu';

<Menu>
  <SubMenu title="Sub Menu">
    <MenuItem key="sub1">Option 1</MenuItem>
    <MenuItem key="sub2">Option 2</MenuItem>
  </SubMenu>
</Menu>

Vertical Menu

This snippet illustrates how to create a vertical menu by setting the mode prop to 'vertical'. It's useful for sidebar navigation.

import Menu, { Item as MenuItem } from 'rc-menu';

<Menu mode="vertical">
  <MenuItem key="1">Option 1</MenuItem>
  <MenuItem key="2">Option 2</MenuItem>
  <MenuItem key="3">Option 3</MenuItem>
</Menu>

0

README

rc-menu

react menu component

examples

• full
• pure css menu

Usage

• It uses the bootstrap's css and Font Awesome

see examples

install

Development

npm install
npm start

Test Case

http://localhost:8000/tests/runner.html?coverage

Coverage

http://localhost:8000/node_modules/rc-server/node_modules/node-jscover/lib/front-end/jscoverage.html?w=http://localhost:8000/tests/runner.html?coverage

License

rc-menu is released under the MIT license.