Статические пропсы макета в Inertia

Давайте теперь представим, что в шапке макета выводится заголовок раздела. На экране аналитики он всегда один и тот же, пока человек ходит по вкладкам внутри раздела, и не зависит от ответа сервера на каждый клик.

У постоянного макета могут быть обычные пропсы Vue с значениями по умолчанию. Статические пропсы задают в кортеже рядом с компонентом макета: второй элемент массива - объект имён и значений. Они фиксируются при объявлении страницы и не меняются при переходах между адресами с тем же определением.

Давайте объявим макет с пропсом заголовка:

<script setup>
	const props = withDefaults(
		defineProps({
			title: String,
		}),
		{
			title: 'My App',
		},
	)
</script>

<template>
	<header>{{ props.title }}</header>
	<main>
		<slot />
	</main>
</template>

Давайте на странице панели передадим статический заголовок в кортеже:

<script setup>
	import AppLayout from '@/Layouts/AppLayout.vue'

	defineOptions({
		layout: [AppLayout, { title: 'Dashboard' }],
	})
</script>

<template>
	<h1>Overview</h1>
</template>

Сделайте экран склада работника Nina так, чтобы шапка макета показывала название этого склада.