# Read page props from a persistent layout

> A persistent layout does not receive the page props as its own props. usePage() does.

- URL: https://laravel-vuejs.space/inertia-layout-child-props
- Author: Anass Ez-zouaine (https://laravel-vuejs.space/author/anass-ez-zouaine)
- Published: 2026-10-11
- Topics: Laravel, VueJs, Inertia

People searching “Inertia layout props Vue” pass the post into the layout component and then the title is empty. A persistent layout wraps the page. The page owns the props. The [layout guide](https://laravel-vuejs.space/inertia-vue-persistent-layout) is how the kit picks `AppLayout`. This page is how that layout reads a value.

> **TL;DR**
>
> -   A persistent layout does not receive the page props as its own props.
> -   usePage() does.
> -   Do not type the layout as if `post` is always there.
> -   Do not wrap `<AppLayout>` inside the page template.
>
> **Who it's for:** Laravel + Vue developers on Inertia
>
> **Applies to:** Laravel 13 · Inertia 3 · Vue 3

## The fix

```vue
<script setup lang="ts">
import { usePage } from "@inertiajs/vue3";

const page = usePage();
</script>

<template>
  <header>{{ page.props.auth?.user?.name }}</header>
  <slot />
</template>
```

`auth` is shared in the [setup guide](https://laravel-vuejs.space/application-setup). A prop you returned from one controller, such as `post`, is on `page.props` only while that page is showing. Do not type the layout as if `post` is always there.

## What to avoid

> **Gotcha**
>
> Do not wrap `<AppLayout>` inside the page template. The kit’s `createInertiaApp` already chose the layout. A second wrap renders it twice. The layout guide says the same thing.

## FAQ

**Q: How do I read page props from a persistent layout?**

A persistent layout does not receive the page props as its own props. usePage() does.

**Q: What goes wrong with Inertia layout props Vue?**

Many developers pass the post into the layout component and then the title is empty. Do not type the layout as if `post` is always there.
