Slot props undefined when wrapped around v-if (Unhandled error during execution of scheduler flush)
Vue version
3.2.29
Link to minimal reproduction
https://stackblitz.com/edit/vitejs-vite-effzhm?file=src%2FApp.vue&terminal=dev
Steps to reproduce
I have a generic component (a table) that defines a slot.
This slot has a prop which is the data for "the current line to display"
As we can see in the repro link, there is no problem with component TableComponent
which is pretty simple and has no v-if around the action slot
But with TableDataComponent
which has a v-if around its action slot to see if the slot is defined before to display it, it seems that the first time the slot is displayed, it pass an undefined value has props and it throws some errors/warnings :
[Vue warn]: Unhandled error during execution of scheduler flush. This is likely a Vue internals bug.
Uncaught (in promise) TypeError: (destructured parameter) is undefined
What is expected?
if v-if is true, display the slot with defined props for the slot if v-if is false, don't display the slot
What is actually happening?
"Uncaught (in promise) TypeError: (destructured parameter) is undefined" is thrown
System Info
No response
Any additional comments?
Currently i have a workaround which is to not destructure slot props and wrap it with a v-if like that
<template #action="slotProps">
<template v-if="slotProps?.item">
my html value
</template>
</template>
but I have to use it every where I want to define a slot for my tableComponent, it is redundant