# @cloud-sn/v-menu

> uxcool menu 基础库

Latest version **1.0.61** (published 2020-07-08) · MIT license · 0 weekly downloads

## Install

```sh
npm install @cloud-sn/v-menu
pnpm add @cloud-sn/v-menu
yarn add @cloud-sn/v-menu
bun add @cloud-sn/v-menu
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.61 |
| Published | 2020-07-08 |
| First published | 2020-05-20 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 133.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | sn1 |

## Links

- npm: https://www.npmjs.com/package/@cloud-sn/v-menu
- npm.io page: https://npm.io/package/@cloud-sn/v-menu

## Dependencies (2)

- [@cloud-sn/v-utils](https://npm.io/package/@cloud-sn/v-utils.md) ^1.0.35
- [@cloud-sn/v-trigger](https://npm.io/package/@cloud-sn/v-trigger.md) ^1.0.66

## Recent versions

- 1.0.61 (latest) — 2020-07-08
- 1.0.60 — 2020-05-20

## README

# v-menu

---

Vue Menu component

## Development

```
yarn

yarn start
```

## Example

```
http://localhost:8000/example/default.html
```

## Feature

* Support IE9+, Chrome, Firefox

## Install

```
npm config set @cloud-sn:registry http://snpm.cnsuning.com

yarn add @cloud-sn/v-menu
```

## Usage

```
import Vue from 'vue';
import VMenu, { VMenuItem, VMenuItemGroup, VSubMenu } from '@cloud-sn/v-menu';
```

## API

### VMenu

#### Props

| 参数名       | 描述                               | 类型                 | 默认   |
| ------------ | ---------------------------------- | -------------------- | ------ |
| theme        | 主题                               | string               | light  |
| mode         | 菜单类型 , 支持水平 , 内嵌两种模式 | horizontal \| inline | inline |
| inlineIndent | inline 模式时菜单缩进宽度          | 24                   |
| selectedKeys | 选中的菜单项, 与 name 属性关联     | string[]             |        |
| openKeys     | 展开的 vSubMenu 项 ,name 属性关联  | string[]             |        |
| visible      | 是否展示                           | boolean              | true   |
| className    | 类名                               | string               | ''     |
| styles       | 样式                               | string               | ''     |
| uniqueOpened | 是否同时只展开一个菜单             | boolean              | true   |

#### Events

| 参数名      | 描述                      | 类型                                      | 默认 |
| ----------- | ------------------------- | ----------------------------------------- | ---- |
| click       | 点击 vMenuItem 触发       | Function({name,item, eventPath,domevent}) |      |
| open-change | vSubMenu 展开或关闭时触发 | Function(openKeys:string[])               |      |
| deselect    | vMenuItem 取消选中时触发  | Function(selectedKeys:string[])           |      |
| select      | vMenuItem 选中时触发      | Functioin(selectedKeys:string[])          |

### vMenuItem

#### Props

| 参数名    | 描述     | 类型           | 默认  |
| --------- | -------- | -------------- | ----- |
| name      | 唯一标识 | String\|Number | ''    |
| disabled  | 是否禁用 | Boolean        | false |
| styles    | 样式     | String         | ''    |
| className | 类名     | String         | ''    |

#### Events

无

### vSubMenu

#### Props

| 参数名    | 描述     | 类型           | 默认  |
| --------- | -------- | -------------- | ----- |
| name      | 唯一标识 | String\|Number | ''    |
| disabled  | 是否禁用 | Boolean        | false |
| styles    | 样式     | String         | ''    |
| className | 类名     | String         | ''    |

#### Events

| 参数名 | 描述                 | 类型                       | 默认 |
| ------ | -------------------- | -------------------------- | ---- |
| click  | 点击 vSubMenu 时触发 | Function({name, domevent}) |      |

### vMenuItemGroup

#### Props

| 参数名    | 描述     | 类型   | 默认 |
| --------- | -------- | ------ | ---- |
| title     | 分组标题 | string | ''   |
| styles    | 样式     | string | ''   |
| className | 类名     | string | ''   |

#### Events

无

---
_Source: https://npm.io/package/@cloud-sn/v-menu · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._