Laravel 8重定向路由时携带锚点定位目标Tab标签的问题咨询

错误原因 #

你原有写法的问题在于route()方法的第二个参数仅用于传递路由定义所需的参数，将模型实例与锚点字符串直接拼接传入会导致参数解析异常，因此触发报错。

正确实现方案 #

Laravel 提供了两种标准实现方式可选： #

方案1：使用fragment()方法（推荐） #

RedirectResponse 实例自带fragment()方法，专门用于设置重定向URL的哈希锚点部分，写法最简洁规范：

return redirect()
    ->route('admin.auth.user.show', $user)
    ->fragment('edit-information')
    ->withFlashSuccess(__('The user was successfully updated.'));

方案2：手动拼接URL后跳转 #

如果你需要手动控制URL生成逻辑，也可以先生成无锚点的路由地址，拼接锚点后使用to()方法跳转：

$redirectUrl = route('admin.auth.user.show', $user) . '#edit-information';
return redirect()
    ->to($redirectUrl)
    ->withFlashSuccess(__('The user was successfully updated.'));

前端配套逻辑 #

仅在URL中带锚点不会自动触发Tab切换，需要在目标页面加一段JS监听锚点完成Tab激活，以Bootstrap 5的Tab组件为例：

// 页面加载完成后根据锚点自动切换对应Tab
document.addEventListener('DOMContentLoaded', function () {
  if (window.location.hash) {
    const tabTrigger = document.querySelector(`[data-bs-toggle="tab"][href="${window.location.hash}"]`);
    if (tabTrigger) {
      bootstrap.Tab.getOrCreateInstance(tabTrigger).show();
    }
  }
});

如果使用其他UI框架的Tab组件，只需调整对应Tab的激活API即可，核心逻辑都是读取当前URL的hash值匹配对应Tab触发激活。

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