上一篇 Ruby 程序员学习 laravel 框架笔记 (10)-blade layout 有讲到关于 layout 的知识,这一篇是对上一篇的细化,对上面的代码进行优化整理。
而使用的 view 的指令是 @include
。
回到 resources/views/layouts
目录,找到 layout 文件 master.blade.php
,它的内容我现在就不全列出来了,因为实在太长了,只列出 body
标签的内容,如下:
...
<body>
<div class="container">
<div class="header clearfix">
<nav>
<ul class="nav nav-pills float-right">
<li class="nav-item">
<a class="nav-link active" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contact</a>
</li>
</ul>
</nav>
<h3 class="text-muted">Project name</h3>
</div>
@yield('body')
<footer class="footer">
<p>© Company 2017</p>
</footer>
</div> <!-- /container -->
</body>
...
现在我们要把这段代码整理一下。
下面请睁大你的眼睛看清楚,以 @yield('body')
这条指令为分割线,分别以它上面和下面的内容抽成两个文件,也就是说 class
等于
header
这个 div 部分抽成 menu.blade.php
文件,而 footer
这个标签部分抽成 footer.blade.php
,这两个文件都放到
resources/views/layouts
目录下。
目录结构如下:
resources/views/layouts
├── app.blade.php
├── footer.blade.php
├── master.blade.php
└── menu.blade.php
最后
resources/views/layouts/menu.blade.php
的内容如下:
// resources/views/layouts/menu.blade.php
<div class="header clearfix">
<nav>
<ul class="nav nav-pills float-right">
<li class="nav-item">
<a class="nav-link active" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contact</a>
</li>
</ul>
</nav>
<h3 class="text-muted">Project name</h3>
</div>
而 resources/views/layouts/footer.blade.php
的内容如下:
// resources/views/layouts/footer.blade.php
<footer class="footer">
<p>© Company {{ date('Y') }}</p>
</footer>
而在 master
layout 如何引用这两个文件呢,很简单,就是使用 @include
指令。
最终 master.blade.php
的 body 部分的内容会如下面这样:
...
<body>
<div class="container">
@include('layouts.menu')
@yield('body')
@include('layouts.footer')
</div> <!-- /container -->
</body>
...
效果是一样,但是代码文件被很好地整理了起来,看着也舒服。
完结。