Call Me Audric
Call Me Audric

Reputation: 53

Detect a template v-slot in a renderless component

I've done a renderless component in VueJS and I try to detect if inside the component, there is a template with a v-slot or not. The objective is to conditional render the code inside the renderless component "Read" bellow. For example, what I need is, in the first case, the btn is rendered because he has a slot, and in the second one, the btn isn't showed because there is no template with v-slot.

Case 1

<Read code="myCode">  
   <template v-slot="{can}">
      {{ can }} 
      <v-btn>
         Reading button
      </v-btn>
   </template> 
</Read>

Case 2

<Read code="myCode">  
   <v-btn>
      Reading button
   </v-btn>
</Read>

I tryed to look in this.$attrs or this.$children inside my renderless component but I didn't find how to achieve that. I know that I need to put a "if" in the render method of my renderless component something like

render () {
   return haveTemplate ? this.$scopedSlots.default({
      can: this.can,
      error: this.error
  }) : null
}

Upvotes: 0

Views: 185

Answers (0)

Related Questions