forked from vikunja/frontend
chore: put ref on popup wrapper div instead of slot
This commit is contained in:
parent
bc7c89d859
commit
0fbe83c362
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<slot name="trigger" :isOpen="open" :toggle="toggle"></slot>
|
<slot name="trigger" :isOpen="open" :toggle="toggle"></slot>
|
||||||
<div class="popup" :class="{'is-open': open}">
|
<div class="popup" :class="{'is-open': open}" ref="popup">
|
||||||
<slot ref="popupContent"/>
|
<slot/>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -12,7 +12,7 @@ import {onBeforeUnmount, onMounted, ref} from 'vue'
|
||||||
export default {
|
export default {
|
||||||
setup() {
|
setup() {
|
||||||
const open = ref(false)
|
const open = ref(false)
|
||||||
const popupContent = ref(null)
|
const popup = ref(null)
|
||||||
|
|
||||||
const toggle = () => {
|
const toggle = () => {
|
||||||
open.value = !open.value
|
open.value = !open.value
|
||||||
|
@ -23,9 +23,9 @@ export default {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
// we actually want to use popupContent.$el, not its value.
|
// we actually want to use popup.$el, not its value.
|
||||||
// eslint-disable-next-line vue/no-ref-as-operand
|
// eslint-disable-next-line vue/no-ref-as-operand
|
||||||
closeWhenClickedOutside(e, popupContent.$el, () => {
|
closeWhenClickedOutside(e, popup.$el, () => {
|
||||||
open.value = false
|
open.value = false
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user