Laravel+Vue3+Inertia+Ziggy路由激活active类无法移除求助

核心原因 #

你遇到的Dashboard链接active类一直存在的问题，基本是因为路由匹配逻辑有误——比如用了路径包含式的判断（比如url.includes('/')），而Dashboard的路径通常是根路径/，其他所有路由的路径都包含/，导致判断永远为真。

正确的两种写法 #

1. 用Ziggy的current()精准匹配路由名

直接通过Ziggy的方法严格匹配路由名称，只有当前路由名完全一致时才添加active类：

<Link 
  :href="route('dashboard')"
  :class="{ 'active': route().current('dashboard') }"
>
  Dashboard
</Link>

current()方法会严格校验当前路由的命名，切换到其他路由时自动返回false，active类会被正常移除。

2. 直接对比Inertia页面的路由名

Inertia会把当前路由的名称注入到页面props里，直接对比即可：

<Link 
  :href="route('dashboard')"
  :class="{ 'active': $page.props.route.name === 'dashboard' }"
>
  Dashboard
</Link>

这种方式完全绕开路径匹配的歧义，是最稳妥的写法。

排查你的错误写法 #

检查你之前的代码，如果你用了以下几种错误逻辑，就会导致问题：

• 用$page.url.includes(route('dashboard'))：根路径/会被所有路由的URL包含，所以永远返回true
• 错误使用通配符：比如route().is('dashboard*')，如果你的Dashboard没有子路由，这种写法可能引发误匹配
• 路由命名不匹配：确认Laravel路由文件里，Dashboard的路由确实命名为dashboard，比如：

Route::get('/', fn () => Inertia::render('Dashboard'))->name('dashboard');

内容的提问来源于stack exchange，提问作者Hardist