PHP Blade模板中如何实现非首页给header添加fixed-header类

修改方案 #

你只需要调整header标签的class属性部分，加入路由判断逻辑即可，具体修改如下：

核心修改点 #

把原代码第一行的

<header class="header">

替换为

<header class="header {{ Route::currentRouteName() !== 'home' ? 'fixed-header' : '' }}">

完整修改后代码 #

<header class="header {{ Route::currentRouteName() !== 'home' ? 'fixed-header' : '' }}">
    @if (Route::currentRouteName() === 'home')
        <img class="header-logo" src="/img/logo.svg" alt="Go Interactive">
    @else
        <a href="{{ route('home') }}">
            <img class="header-logo" src="/img/logo.svg" alt="Go Interactive">
        </a>
    @endif
    <div class="header-menu">
        {{--<a href="#" class="header-menu__link">Blog</a>
        <a href="#" class="header-menu__link">Portfolio</a>
        <a href="#" class="header-menu__link">FAQ</a>--}}
        <a href="{{ route('contacts') }}" class="header-menu__link {{ (Route::currentRouteName() === 'contacts') ? 'active' : '' }}">Contacts</a>
    </div>

    <div class="mobile-menu-button">
        <img src="/img/menu_icon.svg" alt="">
    </div>
</header>

逻辑说明 #

• 当检测到当前路由名称为home时，header仅保留默认的header类，符合首页保持默认样式的要求
• 当检测到当前路由不是首页时，会自动追加fixed-header类，最终渲染结果为<header class="header fixed-header">，完全匹配需求
• 原有logo跳转的逻辑不需要做任何调整，和新追加的类判断逻辑完全兼容

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