# Bind a public URL to a slug

> getRouteKeyName can return slug. The column has to be unique. The title is not a key.

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

People searching “Laravel slug route Vue” put the title in the URL and then a renamed post 404s every old link. Store a slug and bind that column.

> **TL;DR**
>
> -   getRouteKeyName can return slug.
> -   The column has to be unique.
> -   The title is not a key.
> -   Do not use the title as `getRouteKeyName()`.
>
> **Who it's for:** Laravel + Vue developers
>
> **Applies to:** Laravel 13 · Vue 3

## The fix

```php
public function getRouteKeyName(): string
{
    return 'slug';
}
```

```php
Route::get('/posts/{post}', [PostController::class, 'show'])->name('posts.show');
```

`/posts/hello-world` resolves `where slug = hello-world`. The Vue page still receives the post prop. Generate the slug once when the post is created, from the title, and keep it stable when the title changes. A unique index on `slug` is what makes the binding mean one row.

Validate the slug with a rule that allows lowercase letters, numbers, and hyphens, plus `Rule::unique('posts', 'slug')->ignore($post->id)` on update.

## What to avoid

> **Gotcha**
>
> Do not use the title as `getRouteKeyName()`. Spaces and renamed titles break the [Wayfinder](https://laravel-vuejs.space/laravel-wayfinder-vue) URL you already sent to the browser. Do not look the slug up in Vue from a list of every post.

## FAQ

**Q: How do I bind a public URL to a slug?**

getRouteKeyName can return slug. The column has to be unique. The title is not a key.

**Q: What goes wrong with Laravel slug route Vue?**

Many developers put the title in the URL and then a renamed post 404s every old link. Do not use the title as `getRouteKeyName()`.