为 Laravel 应用快速生成 HTML 导航菜单的扩展包:Laravel Menu

WBOY
Freigeben: 2016-06-20 12:33:39
Original
1893 Leute haben es durchsucht

几乎每个网站都有导航菜单,生成这些HTML导航菜单看似简单,但随着菜单数目的增加也会变得越来越麻烦:不仅仅是要渲染一些基本的HTML,更多时候往往还需要管理哪些菜单当前是激活的,如果某个菜单还有子菜单你还想要让被激活的子菜单的父级也是被激活的,更有甚者,有时候你还需要在一些菜单项之间插入HTML。

为此,我编写了一个扩展包(GitHub地址: https://github.com/spatie/laravel-menu),该扩展包提供的API简单优雅,并且有完整丰富的 文档,这里我简单带着大家过一遍其使用方法。

尽管这个扩展包是独立于框架的,但这里我们设定在Laravel应用中使用它。

首先我们使用Composer安装这个扩展:

composer require spatie/laravel-menu
Nach dem Login kopieren

然后在 config/app.php的 providers和 aliases中注册服务提供者和门面:

// config/app.php'providers' => [    // ...    Spatie\Menu\Laravel\MenuServiceProvider::class,],'aliases' => [    // ...    'Menu' => Spatie\Menu\Laravel\MenuFacade::class,],
Nach dem Login kopieren

接下来我们在使用它生成HTML导航菜单。

假设我们要生成这样的菜单:

<ul>    <li><a href="/">Home</a></li>    <li><a href="/about">About</a></li></ul>
Nach dem Login kopieren

这里是其实现代码:

$menu = Menu::new()    ->add(Link::to('/', 'Home'))    ->add(Link::to('/about', 'About'));
Nach dem Login kopieren

然后我们可以在视图中使用 render方法显示菜单:

// in a blade viewHere is the menu: {!! $menu !!}
Nach dem Login kopieren

下面我们尝试生成更复杂的菜单:

<ul>    <li>        <ul>            <li><a href="/introduction">Introduction</a></li>            <li><a href="/requirements">Requirements</a></li>            <li><a href="/installation-setup">Installation and Setup</a></li>        </ul>    </li>    <li>        <h2>Basic Usage</h2>        <ul>            <li><a href="/basic-usage/your-first-menu">Your First Menu</a></li>            <li><a href="/basic-usage/working-with-items">Working With Items</a></li>            <li><a href="/basic-usage/adding-sub-menus">Adding Sub Menus</a></li>        </ul>    </li></ul>
Nach dem Login kopieren

没错,这就是 文档界面的导航菜单,注意到在每个二级子菜单前都有一个标题。对应的生成代码如下:

Menu::new()    ->add(Menu::new()        ->link('/introduction', 'Introduction')        ->link('/requirements', 'Requirements')        ->link('/installation-setup', 'Installation and Setup')    )    ->add(Menu::new()        ->prepend('<h2>Basic Usage</h2>')        ->prefixLinks('/basic-usage')        ->link('/your-first-menu', 'Your First Menu')        ->link('/working-with-items', 'Working With Items')        ->link('/adding-sub-menus', 'Adding Sub Menus')    );
Nach dem Login kopieren

如果你想要让某个菜单项被激活,可以调用 setActive方法:

$menu = Menu::new()    ->add(Link::to('/', 'Home'))    ->add(Link::to('/about', 'About')->setActive());
Nach dem Login kopieren

手动设置菜单项激活是非常烦人的,在大多数案例中更合适的方式是让代码自己判断哪些菜单项被激活:

$menu = Menu::new()    ->add(Link::to('/', 'Home'))    ->add(Link::to('/about', 'About')->setActive());    ->setActiveFromRequest();
Nach dem Login kopieren

除了指定链接之外你还可以灵活使用其它方法指向菜单项:

Menu::new()    ->url('/', 'Home')    ->route('contact', 'Contact')    ->action('AcmeController@detail', 'Acme');
Nach dem Login kopieren

在这个扩展包中还有很多其它有用的方法,比如属性操作、追加内容、支持Macro等,完整文档请参考: https://docs.spatie.be/menu/v1/。

声明:本文为译文,原文请看 这里。

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage