美文网首页Web程序员我是程序员;您好程先生;叫我序员就好了
为 Laravel 项目快速定制拥有 Bootstrap 风格的

为 Laravel 项目快速定制拥有 Bootstrap 风格的

作者: Aufree | 来源:发表于2016-03-25 21:24 被阅读1705次

    本文经授权转自 PHPHub 社区

    同时也关于各位关注我的 GitHub

    说明

    laravel-breadcrumbs 可为你的 Laravel 项目快速定制拥有 Bootstrap 风格的面包屑导航。

    本文章由 The EST Group 成员 @Kelvin 撰写, 首发地为 PHPHub 社区.

    文章的 Demo 项目

    截图

    运行

    Demo 代码请见:

    https://github.com/CycloneAxe/est-breadcrumbs-demo

    请参照此文档运行 Demo:

    https://phphub.org/topics/1902

    文章概览

    1. 安装;
    2. 配置 breadcrumbs;
    3. 生成配置文件;
    4. 基本使用

    1. 安装

    1). 使用 composer 安装:

    composer require davejamesmiller/laravel-breadcrumbs
    

    关于 composer require 的安装方式,请见 这篇文章

    2). 修改 config/app 文件,在 providers 数组内追加如下内容:

    'providers' => [
        ...
        DaveJamesMiller\Breadcrumbs\ServiceProvider::class,
    ],
    

    3). 修改 config/app 文件,在 aliases 数组内追加如下内容:

    'aliases' => [
        ...
        'Breadcrumbs' => DaveJamesMiller\Breadcrumbs\Facade::class,
    ],
    

    2. 配置 breadcrumbs

    app/Http 文件夹内创建 breadcrumbs.php 文件,内容如下:

    <?php
    // Home
    Breadcrumbs::register('home', function($breadcrumbs)
    {
        $breadcrumbs->push('Home', route('home'));
    });
    
    // Home > Blog
    Breadcrumbs::register('blog', function($breadcrumbs)
    {
        $breadcrumbs->parent('home');
        $breadcrumbs->push('Blog', route('blog'));
    });
    

    3. 生成配置文件

    扩展包默认使用 Bootstrap 3 版本, 你也可以通过修改配置信息,来兼容 Bootstrap 2.

    运行此命令生成配置文件:

    php artisan vendor:publish
    

    接着编辑 config/breadcrumbs.php, 指定 Bootstrap 版本:

    'view' => 'breadcrumbs::bootstrap3',
    

    views 字段允许设置的值为:

    • Bootstrap 3: breadcrumbs::bootstrap3
    • Bootstrap 2: breadcrumbs::bootstrap2

    4. 基本使用

    1). 修改 app/HTTP/routes.php, 添加相对应的 Route.

    注意这里新增的 Route 需要定义别名, 因为 breadcrumbs 在生成时会调用了辅助方法 route(), 而此方法是根据 Route 别名来生成对应 Url 的.

    Route::get('home', [
       'as' => 'home',
       function () {
           return view('home');
       }
    ]);
    
    Route::get('blog', [
       'as' => 'blog',
       function () {
           return view('home');
       }
    ]);
    

    2). 在需要展示 breadcrumbs 的页面中调用来渲染:

    {!! Breadcrumbs::render('blog'); !!}
    

    3). 最终生成的效果如下:

    更多的例子请移步 官方文档 参考.


    欢迎关注 LaravelTips, 一个专注于为 Laravel 开发者服务, 致力于帮助开发者更好的掌握 Laravel 框架, 提升开发效率的微信公众号.

    相关文章

      网友评论

        本文标题:为 Laravel 项目快速定制拥有 Bootstrap 风格的

        本文链接:https://www.haomeiwen.com/subject/ealdlttx.html