Layouts

A casca do Vue é um componente .vue. O arquivo .mucrm.php continua valendo só para as views PHP.

Título

public function index()
{
    $this->title('Minha Conta');

    return $this->inertia('Account/Panel');
}

$this->title() escreve o <title> do primeiro HTML e a prop document_title. A entrada da Engine aplica esse texto de novo em cada navegação.

Casca padrão

O arquivo é themes/{tema}/vue/layouts/Public.vue. A página entra no <slot />.

<script setup>
import { usePage } from '@inertiajs/vue3'

const page = usePage()
</script>

<template>
    <div>
        <header>{{ page.props.app?.name || 'MUCRM' }}</header>
        <slot />
    </div>
</template>

Página sem layout usa essa casca. No tema ativo o arquivo é themes/default/vue/layouts/Public.vue.

Outra casca

<script>
import Account from '../layouts/Account.vue'

export default {
    layout: Account,
}
</script>

Para uma página sem casca, o layout é null.

<script>
export default {
    layout: null,
}
</script>

⚠️Não passe uma prop chamada title

Esse nome dentro de inertia() substitui o título definido em $this->title().