Laravel锚点标签href与属性值不一致问题求助

问题现象 #

在/jobs/{id}路由页面中，复用的锚点组件出现路径异常：静态设置href="/jobs"时，实际渲染后属性值显示为/jobs/jobs，切换到其他路由时该问题消失。

路由定义：

Route::get('/jobs/{id}', function ($id)  {
    $job = Job::find($id);
    return view('job',['job'=>$job]);
});

锚点组件代码：

@props(['active' => false])
<a  class="{{ $active ? 'bg-gray-900 text-white' : 'text-gray-300 hover:bg-gray-700 hover:text-white' }} rounded-md px-3 py-2 text-sm font-medium" 
aria-current="{{ $active ? 'page' : 'false' }}"
{{ $attributes }}
>{{$slot}} </a>

解决方法 #

• 使用绝对路径：调用组件时确保传入的href是绝对路径（以/开头），示例：

  <x-nav-link href="/jobs">职位列表</x-nav-link>
  

  若使用相对路径（如href="jobs"），浏览器会基于当前URL/jobs/123自动解析为/jobs/jobs，这是浏览器默认的相对路径解析规则。

• 利用路由命名生成URL：给路由添加名称，通过route()函数生成可靠URL，避免手动写路径出错：

  1. 给路由命名：

     // 详情页路由
     Route::get('/jobs/{id}', function ($id) {
         $job = Job::find($id);
         return view('job',['job'=>$job]);
     })->name('job.show');
     
     // 列表页路由（假设存在）
     Route::get('/jobs', function () {
         // 业务逻辑代码
     })->name('jobs.index');
     

  2. 组件调用时通过路由生成URL：

     <x-nav-link href="{{ route('jobs.index') }}">职位列表</x-nav-link>
     

• 清除视图缓存：运行命令清除Laravel视图缓存，避免缓存导致的渲染异常：

  php artisan view:clear
  

内容的提问来源于stack exchange，提问作者j. Red