快捷導(dǎo)航

Laravel 5框架學(xué)習(xí)之Blade 簡介

更新時(shí)間：2015年04月08日 09:23:35 投稿：hebedich

本文給大家?guī)淼氖荓aravel5框架學(xué)習(xí)系列文章的第4篇，主要向大家簡單介紹下Blade,為什么要介紹它呢，因?yàn)閘aravel的模版引擎采用了blade模版引擎，so....

在多個(gè)頁面中我們可能包含相同的內(nèi)容，像是文件頭，鏈接的css或者js等。我們可以利用布局文件完成這個(gè)功能。

讓我們新建一個(gè)布局文件，例如 views/layout.blade.php

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <link rel="stylesheet" >
</head>
<body>
  <div class="container">
    @yield('content')
  </div>
</body>
</html>

我們創(chuàng)建了不解的結(jié)構(gòu)，引入了bootstrap，注意 @yield 是blade的布局占位符，未來我們的頁面內(nèi)容將填充到這里，修改 about.blade.php

@extends('layout')

@section('content')
  
<h1>About {{ $first }} {{ $last }}</h1>

@stop

上面的代碼表示我們使用布局文件 layout.blade.php，然后在 content 段中添加內(nèi)容。

在 routes.php 中添加：

Route::get('about', 'PagesController@about');
Route::get('contact', 'PagesController@contact');

在 PagesController.php 中添加：

  public function contact() {
    return view('pages.contact');
  }

新建視圖 pages/contact.blade.php

@extends('layout')

@section('content')
  <h1>Contact Me!</h1>
@stop

Check it out!

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

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <link rel="stylesheet" >
</head>
<body>
  <div class="container">
    @yield('content')
  </div>

  @yield('footer')
</body>
</html>

比如 contact.blade.php 中有一段腳本，就可以放在這個(gè)段中。

@extends('layout')

@section('content')
  <h1>Contact Me!</h1>
@stop

@section('footer')
  <script>
    alert('Contact from scritp')
  </script>
@stop

訪問contact會(huì)有對(duì)話框，而about仍然是普通顯示

使用 @if 進(jìn)行判斷

@extends('layout')

@section('content')
  @if ($first = 'Zhang')
    <h1>Hello, Zhang</h1>
  @else
    <h1>Hello, nobody</h1>
  @endif
@stop

也可以視同 @unless 等同于 if !，還有 @foreach 等。

  public function about()
  {
    $people = [
      'zhang san',
      'li si',
      'wang wu'
    ];
    return view('pages.about', compact('people'));
  }
@extends('layout')

@section('content')
  <h1>Person:</h1>
  <ul>
    @foreach($people as $person)
      <li>{{ $person }}</li>
    @endforeach
  </ul>
@stop

有一種情況，數(shù)據(jù)可能來自數(shù)據(jù)庫，集合可能是空，像是這樣：

復(fù)制代碼代碼如下:

$people = [];

處理這種情況，請(qǐng)?zhí)砑?@if 處理

@extends('layout')

@section('content')
  @if (count($people))
    <h1>Person:</h1>
    <ul>
      @foreach($people as $person)
        <li>{{ $person }}</li>
      @endforeach
    </ul>
  @endif

  <h2>Other info</h2>
@stop

That's better.

以上所述就是本文的全部內(nèi)容了，希望能夠?qū)Υ蠹覍W(xué)習(xí)Laravel5有所幫助。

您可能感興趣的文章: