Laravel 中 Twitter Bootstrap 导航的自动活动类

2022-01-10 00:00:00 navigation php laravel twitter-bootstrap

像大多数人一样，我正在为我目前在 Laravel 开发的网站使用 Twitter Bootstrap.到目前为止，我很喜欢将 Laravel 用作与 Rails 等效的 PHP，但我想知道是否有更好的方法来制作导航栏.我试图确保我的导航栏 li 标签自动获取活动类，所以我有这个:

Like most people, I'm using Twitter Bootstrap for the site I'm currently developing in Laravel. So far I'm enjoying using Laravel as a PHP equivalent to Rails, but I'm wondering if there's a better way to do the navigation bars. I'm attempting to make sure that my navbar li tags get the active class automatically, so I have this:

<ul class="nav nav-pills">
@if(URL::current() . "/" == URL::route('home'))
    <li class="active">
@else
    <li>
@endif
    <a href="{{ route('home') }}">Home</a>
</li>
@if(URL::current() == URL::route('about'))
    <li class="active">
@else
    <li>
@endif
    <a href="{{ route('about') }}">About</a>
</li>
</ul>

暂时还好.但是当我有菜单和更多导航时，调试和处理起来会很糟糕.

This'll be fine, for now. But when I've got menus, and more navigations it'll end up looking awful to debug and deal with.

有没有类似于 Laravel 的 Gem Tabulous 的东西，或者一种更好的方式来处理导航拉拉维尔?

Is there anything akin to the Gem Tabulous for Laravel or a generally nicer way to deal with navigation in Laravel?

推荐答案

看看 Bootstrapper 包，它有很多帮助您使用 Twitter Bootstrap 的工具.在您的示例中，您可以像这样构建导航:

Take a look at the Bootstrapper package, it has lots of tools to help you with Twitter Bootstrap. In your example, you could build the navigation like this:

Navigation::pills(array(
    array(
        'label'  => 'Home',
        'url'    => URL::route('home'),
    ),
    array(
        'label'  => 'About',
        'url'    => URL::route('about'),
    )
));

还有速记法，不那么啰嗦，我不是特别喜欢，但是可以用:

There's also the shorthand method, less verbose, which I don't particularly like, but can be used:

Navigation::pills(
    Navigation::links(array(
        array('Home', URL::route('home')),
        array('About', URL::route('about')),
    ))
);

请务必注意，在这两个示例中，Bootstrapper 会自动处理 active 类，将当前请求 URL 与传递给项目的 URL 进行比较.但是，如果您希望为此应用指定不同的条件，只需为更短的方法传递一个 active 值或数组中的第三个值.示例:

It's important to note that in both examples, Bootstrapper takes care of the active class automatically, comparing the current request URL against the one passed to the item. If, however, you wish to specify a different condition for this to apply, simply pass an active value, or a third value in the array, for the shorter method. Example:

Navigation::pills(array(
    array(
        'label'  => 'Home',
        'url'    => URL::route('home'),
    ),
    array(
        'label'  => 'About',
        'url'    => URL::route('about'),
        'active' => true,
    )
));

或

Navigation::pills(
    Navigation::links(array(
        array('Home', URL::route('home')),
        array('About', URL::route('about'), true),
    ))
);

相关文章