# context-menu-component

**Repository Path**: Twilight-Fanyi/context-menu-component

## Basic Information

- **Project Name**: context-menu-component
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-05-05
- **Last Updated**: 2025-05-05

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# ContextMenu Component

## 安装

将整个 `ContextMenu` 目录复制到项目中，或者通过 npm 包管理。

## 使用

1. 引入管理器：
```js
import ctx from './ContextMenu/index.js';
```

2. 注册菜单：
```js
ctx.register('user-menu', [
  { label: '编辑', onClick: () => { /* ... */ } },
  { label: '删除', onClick: () => { /* ... */ } },
  {
    label: '更多',
    children: [
      { label: '复制', onClick: () => {} },
      { label: '粘贴', onClick: () => {} }
    ]
  }
]);
```

3. 在元素上添加 `data-context-menu`：
```html
<div data-context-menu="user-menu">右键我</div>
```

## 样式

引入 `menu.css`，并根据项目主题调整变量或覆盖样式。

## 扩展

- 支持子菜单
- 可定制图标
- 可无障碍访问