Skip to content

Johnathan/vue-context-menu-popup

Repository files navigation

vue-context-menu-popup

GitHub open issues Npm version

Usage

<ContextMenu ref="contextMenu" :menu-items="menuItems"/>

<div class="context-menu-trigger"
	@click.right.prevent="$refs.contextMenu.open($event)">
    Right Click Me!
</div>
import ContextMenu from 'vue-context-menu-popup'
import 'vue-context-menu-popup/dist/vue-context-menu-popup.css';

export default {
  data() {
    return {
        menuItems: [
        {
          label: 'First Menu Item',
        },
        {
          label: 'Disabled Menu Item',
          disabled: true,
        },
        {
          label: 'I have children',
          children: [
            {
              label: 'Child Item 1',
            },
            {
              label: 'I also have children',
              children: [
                {
                  label: 'Child Item 2',
                },
              ],
            },
          ],
        },
        ]
    }
  },
  components: {
    ContextMenu
  }
}

API

context-menu

A simple context menu component

<ContextMenu :menu-items="[....]"/>

props

  • menu-items Array (required)

data

  • visible

initial value: false

  • contextMenuPosition

initial value: [object Object]

  • openPosition

initial value: 'context-menu-open-right'

methods

  • close()

  • open(position)

    Accepts an Object with an x, y position or an instance of Event

Installation

npm install vue-context-menu-popup

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Lints and fixes files

npm run lint

Run your unit tests

npm run test:unit

Update the API section of README.md with generated documentation

npm run doc:build

About

No description, website, or topics provided.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published