Skip to content

Navigation

Standard navigation

To navigate in pages/views that are not controlled by Inertia, use the standard <a>. Not surprisingly, it works really well. 😉

Inertia navigation

To navigate in pages, use the Inertia <Link> component. The <Link> component is a light wrapper around a standard anchor <a> tag that intercepts click events and prevent full page reloads.

INFO

Learn more about how Inertia provide an SPA experience in the Inertia docs.

To create an Inertia link, use the Inertia <Link> component. Any attributes you provide to this component will be proxied to the underlying HTML tag.

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

<template><Link href="/">Home</Link></template>
jsx
import { Link } from '@inertiajs/react'

function Nav() {
  return <Link href="/">Home</Link> 
}
svelte
import { inertia, Link } from '@inertiajs/svelte'

<a href="/" use:inertia>Home</a>

<Link href="/">Home</Link>

All open source projects are released under the MIT License.