簡介
Blade它不像其他流行的 PHP 模板引擎那樣限制你在視圖中使用原生的 PHP 代碼，事實(shí)上它就是把 Blade 視圖編譯成原生的 PHP 代碼并緩存起來。緩存會在 Blade 視圖改變時而改變，這意味著 Blade 并沒有給你的應(yīng)用添加編譯的負(fù)擔(dān)。Blade 視圖文件使用 .blade.php 后綴，一般情況下都被存儲在 resources/views 目錄。
1. 繼承、片段、占位、組件、插槽
1.1 繼承
1.1.1 定義父模板
Laravel/resources/views/base.blade.php
1.1.2 子模板繼承
路徑：Laravel/resources/views/child.blade.php
@extends('base')
1.2 片段
1.2.1 父模板定義片段
@section('part')
// 中間內(nèi)容即使一個片段
@show
1.2.2 子模板填充片段
@section('part')
片段填充內(nèi)容
@endsection
1.3 占位
1.3.1 父模板占位：
@yield('title')
1.3.2 子模板填充占位
第一種填充（文本）：
@section('title' , '填充的文本占位')
第二種填充（文本 or html）
@section('title')
填充的占位
@endsection
1.4 組件、插槽
1.4.1 定義組件
路徑：Laravel/resources/views/component.blade.php
<div class='component'>
<!-- $title，$content 變量實(shí)際上就是預(yù)定義的插槽 -->
<div class='title'>{{ $title }}</div>
<div class='content'>{{ $content }}</div>
</div>
1.4.2 使用組件
路徑：Laravel/resources/views/test.blade.php
@component('component')
@slot('title')
組件標(biāo)題
@endsolt
@slot('content')
組件內(nèi)容
@endslot
@endcomponent
2. 數(shù)據(jù)顯示
2.1 轉(zhuǎn)義輸出
{{ $name }}
2.2 未轉(zhuǎn)義輸出
{!! $name !!}
2.3 原格式輸出
第一種（適合量不多）：
@{{ name }}
第二種（適合量多）：
@verbatim
{{ name }}
{{ sex }}
{{ age }}
@endverbatim
3. 流程控制
3.1 for
注意：
- 沒有 $loop 變量
- 沒有 @empty
- 有 @break
- 有 @continue
@for ($i = 0; $i < 10; ++$i)
{{ $i }} <br />
@endfor
3.2 foreach
注意：
- 有 $loop 變量
- 沒有 @empty
- 有 @break
- 有 @continue
@foreach ($data as $k => $v)
{{ $k }} <br />
@endforeach
3.3 forelse
注意：
- 有 $loop 變量
- 必須有 @empty
- 有 @break
- 有 @continue
@foreach ($data as $k => $v)
{{ $k }} <br />
@empty
數(shù)組沒有數(shù)據(jù)
@endforeach
4. 使用原生 PHP
@php echo "使用原生 PHP"; @endphp
5. 包含子視圖
注意
- 被包含的子視圖可以引用父視圖定義的所有變量。
- 你可以傳遞額外的數(shù)據(jù)到子視圖
定義父視圖 parent.blade.php，并包含子視圖 child.blade.php，且傳入額外數(shù)據(jù)
/**
* 父視圖
* 父視圖擁有變量 $name = 'chenxuelong'
*/
<div class='parent'>
<div class='username'>{{ $username }}</div>
<div class='child'>
<!-- 包含子視圖 -->
@include('child' , [
'other' => '額外數(shù)據(jù)'
])
</div>
</div>
/**
* 子視圖
*/
<div class='username'>{{ $username }}</div>
<div class='other'>{{ $other }}</div>
總結(jié)