Closed
Description
Version
3.0.0-alpha.8
Steps to reproduce
Create a component named TButton
<template>
<button><slot/></button>
</template>
Create a component named TPopover
<template>
<span>
<div ref="popover" id="tooltip" role="tooltip">
<slot>{{content}}</slot>
</div>
<slot name="reference"/>
</span>
</template>
<script>
import { onMounted, ref } from 'vue'
export default {
name: 'TPopover',
props: {
content: { type: String, default: '' },
placement: { type: String, default: 'bottom' },
showArrow: { type: Boolean, default: true }
},
setup (props, { slots}) {
const popover = ref(null)
onMounted(() => {
console.log(slots.reference()[0].el) // Print null, can't get the VNode of button
})
return {
popover
}
}
}
</script>
using named slot
<t-popover>
<div>
popover content
</div>
<template #reference>
<t-button>button</t-button>
</template>
</t-popover>
What is expected?
Get the named slot's VNode
What is actually happening?
Get null
Metadata
Metadata
Assignees
Labels
No labels