Don't show multiple tooltips at once in a generated list of tooltips about vue-tippy HOT 6 CLOSED

When you use reactive option (reserve event listeners), you only can use 1 html/component element per tippy instance

Can you setup a small demo so i can fix it or modify your codes? (https://codesandbox.io/s/vue or github repo)

from vue-tippy.

I have created a demo here https://codesandbox.io/s/z6my0n2p13 and have realised it is the @click.stop that is causing the behaviour. The button to open the tooltip is within an <li> which itself is selectable, that is why I am using @click.stop on the tooltip button, othwerwise it selects the parent <li>.

I guess I could make the tooltips react on hover, rather than click as a tempoary workaround. Unless there is another way?

from vue-tippy.

u can add @mouseleave="($event) => $event.target._tippy.hide()"

https://codesandbox.io/s/yyx92969

from vue-tippy.

That then means you can't interact with the tooltip as when you leave the button it closes it.

from vue-tippy.

maybe you can manage tippy instances like this https://codesandbox.io/s/82kz5m06k9 ?

from vue-tippy.

Thank you for your help and apologies for not replying. I gave the sample code a go but in the end have stuck with a hover interaction instead of a click to keep things simple.

from vue-tippy.