Contextmenu won't close after open another one

[pa4ul]

Hello!

I'm stuck on working with the vue-context. I don't know if it is a bug or if i wrote something false, if i open one contextmenu everything happens fine but if i start opening another one the first one opened should normally close automatically but in my case now both are opened.

Is it supposed to work like this? If yes, how can i achieve that only one is opened?

Thanks 👍

[alectrocute]

@pa4ul I am not a contributor to this project, but I can maybe give you some half decent advice. I was able to get around this limitation by closing the context menu via a mouseleave event on the parent element. For something like a card list, this did the trick.

<article 
   @contextmenu.prevent="$refs.contextmenu.open"
   @mouseleave.prevent="$refs.contextmenu.close"
>
    <VueContext ref="contextmenu>...</VueContext>
</article>

[alectrocute]

@rawilk Any input?

[rawilk]

I'm not sure, as I've never really dealt with that kind of scenario. Whenever I've used it in an app, I've only needed one instance of the context menu at a time.

However, it does do this behavior that you're describing on the demo pages in the docs since I'm using more than one instance there. I'm not really sure of a good solution to that, but what @alectrocute provided seems to work, I'd recommend using that.

[MatheusFr27]

Hello, I had the same problem and for my situation I found a satisfactory solution.

In my case I am creating a treeview, so the vue-context was instantiated numerous times. Following the same idea of @alectrocute , I created a <div> that takes the vue-context plus the element and it applies @ mouseleave.prevent =" $ refs.menu.close ".

Along with this, I applied a class .menu-context-container that passes apadding: 0.1px;. Therefore, when exiting the element with the mouse, the vue-context will automatically close.

Hope this helps. :smile::v: