@ihatecode/react-context-menu

Englist | 中文

Introduction

A context menu component written in React.

Install

``bash

npm

npm install @ihatecode/react-context-menu

yarn

yarn add @ihatecode/react-context-menu

pnpm

pnpm add @ihatecode/react-context-menu
`

Usage

`jsx
import React from 'react';
import ContextMenu from '@ihatecode/react-context-menu';
import '@ihatecode/react-context-menu/lib/style.css';

const App: React.FC = () => {
const [contextMenu] = ContextMenu.useContextMenu();

return (

contextMenu={contextMenu}
items={[{ key:'1', label: 'item1' }, { key:'2', label: 'item2' }]}
onClick={(key) => console.log(key)}
/>

);
};

export default App;
``

Demo

Online demo: https://q5fknh.csb.app/


Props

##### ContextMenu Props
|Property|Type|Optional
|-|-|:-:
|className|string|Y|
|zIndex|number|Y|
|contextMenu|object|N|
|items|any|N|
|onClick|(key: string) => void|Y|

##### ContextMenu Item Props
|Property|Type|Optional
|-|-|:-:
|key|string|N|
|label|string|N|
|icon|ReactNode|Y|
|disabled|boolean|Y|
|children|any|Y|

License

MIT