search

vuetifyjs / vuetify

🐉 Vue Component Framework
https://vuetifyjs.com
MIT License
39.66k stars 6.95k forks source link

[Feature Request] [VMenu] Ability to open the menu with a right-click event #9235

Open morficus opened 4 years ago

morficus commented 4 years ago

Problem to solve

Currently the VMenu component can be opened either with a click-event (default) or on hover (configurable via a prop). A common use case (especially for large or "enterprise-class" applications) is to have a custom context menu which is invoked via a right-click. As things stand today, VMenu does not handle this out of the box.

Proposed solution

Create a new prop to VMenu called open-on-right-click or open-on-contextmenu (with a default value of false) which would behave the same as open-on-hover and open-on-click.

This would also involve updating the ClickOutside directive to handle both the onclick as well as the oncontextmenu events.

MajesticPotatoe commented 4 years ago

also can easily be done by @contextmenu.prevent="on.click" in activator slot, or @contextmenu.prevent="vmodelProp = true" on a non-activator slot button. eg: https://codepen.io/majesticpotatoe-the-bashful/pen/MWWWWjR

morficus commented 4 years ago

ah that is great to know. there is still the issue of the ClickOutside directive not having support for the oncontextmenu event. Let me know if I should open a bug for that - https://codepen.io/morficus/pen/QWWWWdZ

obedparla commented 3 years ago

You can use both right click and left click on the same button with @MajesticPotatoe 's suggestion above. Just use @contextmenu.prevent="on.click" to show the menu on right-click and a @click to use the click as usual.

I found this helpful to have a 'default' one-click behaviour and a menu on right-click.

Excalibaard commented 2 years ago

I think having official support for a contextmenu (or auxclick) variant would be much better than remapping the click action to oncontextmenu.

Currently, there is no support for oncontextmenu events outside the menu, so all the menus you open stay open, with high chance of overlap unless you build a higher-level watcher that closes any other menus if you open a new one, or use a single menu in a parent container that receives arguments from the underlying list items, which is a very different flow from regular v-menu usage. Additionally, using oncontextmenu on an element which already has the menu opened, I'd expect the menu to translate to the new cursor location, instead of closing (and then having to open it again), while with a click event (outside or not), the closing iof the menu is expected.

I think with a v-menu-context component, extended from v-menu with its own definition for oncontextmenu and a redefinition for the clickhandler, (or hidden behind the open-on-contextmenu prop) a lot of these issues could be taken away.