vuetifyjs / vuetify

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

Datatable row click stop propagation #1538

Closed FilippiSilva closed 7 years ago

FilippiSilva commented 7 years ago

Steps to reproduce

Declare a datatable by adding a click event on the row and adding a menu button in the datatable column

Versions

Vue 2.4.1 Vuetify 0.14.11

What is expected ?

How should I declare the menu so that I can give a stop propagation on it by stopping the click on the table row

What is actually happening ?

Is running both, click on the line and the menu opens

Reproduction Link

https://codepen.io/FilippiSilva/pen/VzqeRB

johnleider commented 7 years ago

This has to be reverted. It brings up additional issues that must be accounted for. The select generators has to change its functionality, as well as, the propagation closed other menus, with this change, menus will stay up even if you click another activator.

KaelWD commented 7 years ago

How should I declare the menu so that I can give a stop propagation on it by stopping the click on the table row

A possible workaround would be to check if the button was clicked before running the event handler: https://codepen.io/anon/pen/zdeExZ

johnleider commented 7 years ago

After careful consideration, this is something that will have to be left up to the developer to handle. Reason being, you have nested click events and the propagation of the activator is absolutely necessary for other functionality required in the framework, such as other menus closing when another opens, due to be able to consume the click event propagated from the incoming menu.

robertsLando commented 6 years ago

Solved by using @click.stop to stop propagation

lock[bot] commented 5 years ago

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs. Please direct any non-bug questions to our Discord