Answers for "vue.js slots"

3

vue.js slots

Parent Component :
<template>
  <Child>
    <template v-slot:header>
      <h1>Header </h1>
    </template>

    <template v-slot:content>
      <h1> Content </h1>
    </template>

    <template v-slot:footer>
      <h1>Footer</h1>
    </template>
  </Child>
</template>

Child component :

<template>
  <slot name="header">Default Value</slot>
  <slot name="content">Default Value</slot>
  <slot name="footer">Default Value</slot>
</template>
Posted by: Guest on August-19-2021
-2

what is slot in vue.js

// app.vue
<template>
  <current-user>
    <template v-slot:default="slotProps">{{ slotProps.user.firstName }}</template>    
  </current-user>
</template>
Posted by: Guest on August-16-2021
-2

what is slot in vue.js

// app.vue
<template>
  <current-user v-slot="{user}">
    {{ user.firstName }}
  </current-user>
</template>
Posted by: Guest on August-16-2021

Code answers related to "Javascript"

Browse Popular Code Answers by Language