Closed kaguya3222 closed 2 years ago
you are checking the tippy v6 docs, the current vue-tippy
uses tippy.js v4. you can check the full v4 docs here https://kabbouchi.github.io/tippyjs-v4-docs/ and https://kabbouchi.github.io/vue-tippy/
Tippy v6 supported in the next
branch (Vue 3 only), https://vue-tippy.netlify.app/ https://github.com/KABBOUCHI/vue-tippy/tree/next
I understood, thank you.
I was trying to fix this issue using tippy.js plugin that is mentioned in docs
Currently, I found another solution (kind of hack, but it's working)
<template>
<tippy ref="tippy">
<div @focusout="onFocusout">
some content
</div>
</tippy>
</template>
<script>
export default {
methods: {
onFocusout() {
setTimeout(() => {
const tippy = this.$refs.tippy
if (!tippy) return
const isFocusOutside = !tippy.tip.popper.contains(document.activeElement)
if (isFocusOutside) this.hide()
})
}
}
}
</script>
I think this issue can be closed.
I want to add tippy.js plugin, that is mentioned in docs, but it seems like it's not added when I try to do something like:
or
Reproduction: codesandbox
A plugin that I added in reproduction should hide tippy after focusout event inside it, it works when I tried to use this plugin inside
tippy()
but it's not working when I use vue-tippytippy
component