Subscribe on changes!

nested named slot, $slots.default still exist

avatar
Feb 7th 2021

Version

3.0.5

Reproduction link

https://codepen.io/lanseria/pen/WNowdwj

Steps to reproduce

nested named slots $slots.default will still exist when parent component use

What is expected?

i expect it can be undefault or have a method to child component var by its slots

What is actually happening?

slots always have default function when use nested slots

avatar
Feb 7th 2021

Since you are passing a slot:

<advance-search>
    <slot v-if="$slots['crud-search']" name="crud-search"></slot>
  </advance-search>

$slots.default has to exist. Its evaluation $slots.default() is what will tell you if there is anything to render or not. In yuor scenario, because there is a v-if, there is a comment, you need to filter it out: slots.default().filter(({ type }) => type !== Vue.Comment)