Laravel 五基础（四）- Blade 简介-PHP-Tutorial-php.cn

Laravel 五基础（四）- Blade 简介

WBOY

Freigeben： 2016-06-13 12:17:17

Original

849 Leute haben es durchsucht

Laravel 5 基础（四）- Blade 简介

在多个页面中我们可能包含相同的内容，像是文件头，链接的css或者js等。我们可以利用布局文件完成这个功能。

让我们新建一个布局文件，例如 views/layout.blade.php

<code><!doctype html><html lang="en"><head>    <meta charset="UTF-8">    <title>Document</title>    <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css"></head><body>    <div class="container">        @yield(&#39;content&#39;)    </div></body></html></code>

Nach dem Login kopieren

我们创建了不解的结构，引入了bootstrap，注意 @yield 是blade的布局占位符，未来我们的页面内容将填充到这里，修改 about.blade.php

<code>@extends(&#39;layout&#39;)@section(&#39;content&#39;)    <h1>About {{ $first }} {{ $last }}</h1>@stop</code>

Nach dem Login kopieren

上面的代码表示我们使用布局文件 layout.blade.php，然后在 content 段中添加内容。

在 routes.php 中添加：

<code>Route::get(&#39;about&#39;, &#39;[email&#160;protected]&#39;);Route::get(&#39;contact&#39;, &#39;[email&#160;protected]&#39;);</code>

Nach dem Login kopieren

在 PagesController.php 中添加：

<code>    public function contact() {        return view(&#39;pages.contact&#39;);    }</code>

Nach dem Login kopieren

新建视图 pages/contact.blade.php

<code>@extends(&#39;layout&#39;)@section(&#39;content&#39;)    <h1>Contact Me!</h1>@stop</code>

Nach dem Login kopieren

Check it out!

在布局文件中我们可以添加多个 @yield , 比如在 layout.blade.php 中添加 @yield('footer') ：

<code><!doctype html><html lang="en"><head>    <meta charset="UTF-8">    <title>Document</title>    <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css"></head><body>    <div class="container">        @yield(&#39;content&#39;)    </div>    @yield(&#39;footer&#39;)</body></html></code>

Nach dem Login kopieren

比如 contact.blade.php 中有一段脚本，就可以放在这个段中。

<code>@extends(&#39;layout&#39;)@section(&#39;content&#39;)    <h1>Contact Me!</h1>@stop@section(&#39;footer&#39;)    <script>        alert(&#39;Contact from scritp&#39;)    </script>@stop</code>

Nach dem Login kopieren

访问contact会有对话框，而about仍然是普通显示

使用 @if 进行判断

<code>@extends(&#39;layout&#39;)@section(&#39;content&#39;)    @if ($first = &#39;Zhang&#39;)        <h1>Hello, Zhang</h1>    @else        <h1>Hello, nobody</h1>    @endif@stop</code>

Nach dem Login kopieren

也可以视同 @unless 等同于 if !，还有 @foreach 等。

<code>    public function about()    {        $people = [            &#39;zhang san&#39;,            &#39;li si&#39;,            &#39;wang wu&#39;        ];        return view(&#39;pages.about&#39;, compact(&#39;people&#39;));    }</code>

Nach dem Login kopieren

<code>@extends(&#39;layout&#39;)@section(&#39;content&#39;)    <h1>Person:</h1>    <ul>        @foreach($people as $person)            <li>{{ $person }}</li>        @endforeach    </ul>@stop</code>

Nach dem Login kopieren

有一种情况，数据可能来自数据库，集合可能是空，像是这样：

<code>$people = [];</code>

Nach dem Login kopieren

处理这种情况，请添加 @if 处理

<code>@extends(&#39;layout&#39;)@section(&#39;content&#39;)    @if (count($people))        <h1>Person:</h1>        <ul>            @foreach($people as $person)                <li>{{ $person }}</li>            @endforeach        </ul>    @endif    <h2>Other info</h2>@stop</code>

Nach dem Login kopieren

That's better.

Laravel 五 基础（四）- Blade 简介

Laravel 五基础（四）- Blade 简介