# Default a prop an Inertia page did not get

> withDefaults fills a prop that is missing. A prop that arrives as null stays null.

- URL: https://laravel-vuejs.space/vue-prop-defaults-inertia
- Author: Anass Ez-zouaine (https://laravel-vuejs.space/author/anass-ez-zouaine)
- Published: 2026-10-11
- Topics: Laravel, VueJs, TypeScript

People searching “Vue prop default Inertia” set a default and still crash on `null`. `withDefaults` fills `undefined`. JSON `null` is a present value. The [TypeScript guide](https://laravel-vuejs.space/typescript-laravel-vue-pages) types the props. This page is the default.

> **TL;DR**
>
> -   withDefaults fills a prop that is missing.
> -   A prop that arrives as null stays null.
> -   Do not default `post` to `{}` so a missing record renders an empty editor.
>
> **Who it's for:** Laravel + Vue developers
>
> **Applies to:** Laravel 13 · Vue 3 · TypeScript

## The fix

```vue
<script setup lang="ts">
const props = withDefaults(defineProps<{ search?: string }>(), {
  search: "",
});
</script>
```

If the controller always sends `search`, the default never runs. Send the key only when you mean it, or send `''` from Laravel when the query string is empty:

```php
'search' => $request->string('search')->trim()->toString(),
```

That is a string, including an empty one. The default is then unnecessary, which is the better fix.

## What to avoid

> **Gotcha**
>
> Do not default `post` to `{}` so a missing record renders an empty editor. A missing record should 404 in the controller. The page should not pretend there is a post.

## FAQ

**Q: How do I default a prop an Inertia page did not get?**

withDefaults fills a prop that is missing. A prop that arrives as null stays null.

**Q: What goes wrong with Vue prop default Inertia?**

Many developers set a default and still crash on `null`. Do not default `post` to `{}` so a missing record renders an empty editor.