如何将 slot/data 传递给惯性布局组件

Question

如何将插槽或道具传递给惯性的 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 标签内未显示任何内容...

Answer 1

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

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

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

如何将 slot/data 传递给惯性布局组件

how to pass slot/data to inertia layout component

inertiajs

laravel

vue.js