Блог

Как передать прорезь или упорку layout компоненту по инерции?

Например, вот ForgotPassword компонент:

 <template>
    <slot name="title">Forgot Password</slot>

    Forgot pw stuff goes here...
</template>

<script>
import CardLayout from "@/Layouts/CardLayout";

export default {
    layout: CardLayout,
}
 

Вот CardLayout компонент:

 <template>
    <h1>{{ $slots.title }}</h1>

    <slot/>
</template>
 

Внутри h1 тега ничего не отображается…

 // CardLayout
<template>
    <h1><slot name="title" /></h1>
    <slot />
</template>

// ForgotPassword
<template>
    <template #title>Forgot Password</template>

    Forgot pw stuff goes here...
</template>