https://github.com/terryz/v-selectmenu

SelectMenu for Vuejs, A simple, easier and highly customized menu solution
https://github.com/terryz/v-selectmenu

contextmenu embed i18n javascript menu multiple-group multiple-level quick-search vuejs

Last synced: 1 day ago
JSON representation

SelectMenu for Vuejs, A simple, easier and highly customized menu solution

• Host: GitHub
• URL: https://github.com/terryz/v-selectmenu
• Owner: TerryZ
• License: mit
• Created: 2018-07-09T02:43:21.000Z (over 6 years ago)
• Default Branch: dev
• Last Pushed: 2024-12-17T09:29:12.000Z (5 days ago)
• Last Synced: 2024-12-17T10:27:12.177Z (5 days ago)
• Topics: contextmenu, embed, i18n, javascript, menu, multiple-group, multiple-level, quick-search, vuejs
• Language: JavaScript
• Homepage: https://terryz.github.io/docs-vue3/select-menu/
• Size: 813 KB
• Stars: 187
• Watchers: 6
• Forks: 24
• Open Issues: 11
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG-CN.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# [v-selectmenu](https://terryz.github.io/docs-vue3/select-menu/) [![CircleCI](https://dl.circleci.com/status-badge/img/gh/TerryZ/v-selectmenu/tree/master.svg?style=svg)](https://dl.circleci.com/status-badge/redirect/gh/TerryZ/v-selectmenu/tree/master) [![codecov](https://codecov.io/gh/TerryZ/v-selectmenu/branch/master/graph/badge.svg?token=9L4eMOTMJL)](https://codecov.io/gh/TerryZ/v-selectmenu) [![npm version](https://img.shields.io/npm/v/v-selectmenu.svg)](https://www.npmjs.com/package/v-selectmenu) [![npm download](https://img.shields.io/npm/dy/v-selectmenu.svg)](https://www.npmjs.com/package/v-selectmenu) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)

SelectMenu for Vue3, A simple, easier and highly customized menu solution

## Examples and Documentation

Documentation and examples please visit below sites

- [github pages](https://terryz.github.io/docs-vue3/select-menu/)

The jQuery version: [SelectMenu](https://github.com/TerryZ/SelectMenu)

## Features

- Provide layout management

- Provide input and button components

- Provide a variety of custom slots

- Support single-select or multi-select mode menu items

- Support multiple groups

- Support multiple levels

- Each functional component can be flexibly combined and applied

## Installation



``` bash

# npm

npm i v-selectmenu

# yarn

yarn add v-selectmenu

# pnpm

pnpm add v-selectmenu

```

## Usage

```vue

  

    

      

    

    

      SelectMenu

      Menu item 1

      Menu item 2

      Menu item 3

    

  

import {

  SelectMenuDropdown,

  SelectMenuTrigger,

  SelectMenuBody,

  SelectMenuHeader,

  SelectMenuItem

} from 'v-selectmenu'

function handleAction (action) {

  console.log(action)

}

```

## Components

- **SelectMenuDropdown** The dropdown container

- **SelectMenuTrigger** Built-in dropdown trigger button

- **SelectMenuBody** The menu root container

- **SelectMenuSection** The menu section container

- **SelectMenuBlock** The menu block container

- **SelectMenuRow** Align content horizontally

- **SelectMenuColumn** Align content vertically

- **SelectMenuHeader** Menu main header item

- **SelectMenuSubHeader** Menu sub header item

- **SelectMenuDivider** Menu divider

- **SelectMenuGroup** Menu group container

- **SelectMenuGroupItem** Menu group item

- **SelectMenuChildLevel** Child level menu container

- **SelectMenuInput** Menu input component

- **SelectMenuButton** Menu button component

- **SelectMenuItem** Menu item

- **SelectMenuCheckboxGroup** Menu checkbox group

- **SelectMenuCheckboxItem** Menu checkbox item

- **SelectMenuRadioGroup** Menu radio group

- **SelectMenuRadioItem** Menu radio item

## License

[![license](https://img.shields.io/badge/license-MIT-brightgreen.svg)](https://mit-license.org/)

## Dependencies

- [v-dropdown](https://github.com/TerryZ/v-dropdown) - The dropdown container layer