Blade模板簡介
問: 什么是Blade模板?
答: Blade模板是Laravel提供一個既簡單又強大的模板引擎;
和其他流行的PHP模板引擎不一樣,他并不限制你在視圖里使用原生PHP代碼;
所有Blade視圖頁面都將被編譯成原生的PHP代碼并緩存起來,除非你的模板文件被修改,否則不會重新編譯。
而這些都意味著Blade不會給我們增加任何負擔。
在其他框架中,分頁可能是件非常痛苦的事,Laravel 讓這件事變得簡單、易于上手。Laravel 的分頁器與查詢構建器和 Eloquent ORM 集成在一起,并開箱提供方便的、易于使用的、基于數據庫結果集的分頁。分頁器生成的 HTML 兼容 Bootstrap CSS 框架。
基本使用
基于查詢構建器進行分頁 有多種方式實現分頁功能,最簡單的方式就是使用查詢構建器或 Eloquent 查詢提供的 paginate 方法。該方法基于當前用戶查看頁自動設置合適的偏移(offset)和限制(limit),直白點說就是頁碼和每頁顯示數量。默認情況下,當前頁通過 HTTP 請求查詢字符串參數 page 的值判斷。當然,該值由 Laravel 自動檢測,然后自動插入分頁器生成的鏈接中。
讓我們先來看看如何在查詢中調用 paginate 方法。在本例中,傳遞給 paginate 的唯一參數就是你每頁想要顯示的數目,這里我們指定每頁顯示 15 個:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<?php namespace App\Http\Controllers; use Illuminate\Support\Facades\DB; use App\Http\Controllers\Controller; class UserController extends Controller { /** * 顯示應用中的所有用戶 * * @return Response */ public function index() { $users = DB::table( 'users' )->paginate(15); return view( 'user.index' , [ 'users' => $users ]); } } |
注:目前,使用 groupBy 的分頁操作不能被 Laravel 有效執(zhí)行,如果你需要在分頁結果中使用 groupBy,推薦你手動查詢數據庫然后創(chuàng)建分頁器。
簡單分頁
如果你只需要在分頁視圖中簡單的顯示“下一頁”和“上一頁”鏈接,可以使用 simplePaginate 方法來執(zhí)行一個更加高效的查詢。在渲染包含大數據集的視圖且不需要顯示每個頁碼時這一功能非常有用:
$users = DB::table('users')->simplePaginate(15);
顯示分頁結果
當調用 paginate 方法時,你將獲取Illuminate\Pagination\LengthAwarePaginator 實例,而調用方法simplePaginate 時,將會獲取 Illuminate\Pagination\Paginator 實例。這些對象提供相關方法描述這些結果集,除了這些輔助函數外,分頁器實例本身就是迭代器,可以像數組一樣對其進行循環(huán)調用。所以,獲取到結果后,可以按如下方式使用 Blade 顯示這些結果并渲染頁面鏈接:
1
2
3
4
5
6
7
|
<div class = "container" > @ foreach ( $users as $user ) {{ $user ->name }} @ endforeach </div> {{ $users ->links() }} |
links 方法將會將結果集中的其它頁面鏈接渲染出來。每個鏈接已經包含了 page 查詢字符串變量。記住,render 方法生成的 HTML 兼容 Bootstrap CSS 框架。
帶條件的分頁
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
public function index() { $type = $this ->request->get( 'type' ,1); $users = DB::table( 'users' )->where( function ( $query ) use ( $type ) { if ( $type ) { $query ->where( 'type' , $type ); } })->paginate(15); return view( 'user.index' , [ 'users' => $users ]); } ] <div class = "container" > @ foreach ( $users as $user ) {{ $user ->name }} @ endforeach </div> {!! $list ->appends([ 'type' => $type ])->links() !!} |
知識點補充:
Laravel框架中Blade模板的用法
1. 繼承、片段、占位、組件、插槽
1.1 繼承
1、定義父模板 Laravel/resources/views/base.blade.php
2、子模板繼承 @extends('base')
1.2 片段
1、父模板定義片段
1
2
3
|
@section( 'part' ) // 中間內容即使是一個片段 @show |
2、子模板填充片段
1
2
3
|
@section( 'part' ) // 片段填充內容(后臺的表單、列表等) @endsection |
1.3 占位
1、父模板占位
@yield('title')
2、子模板填充占位
第一種填充(文本):
@section('title' , '填充的文本占位')
第二種填充(文本 or html)
1
2
3
|
@section( 'title' ) // 填充的占位 @endsection |
1.4 組件、插槽
1、定義組件
1
2
3
4
5
6
7
|
// 路徑:Laravel/resources/views/component.blade.php <div class = 'component' > <!-- $title , $content 變量實際上就是預定義的插槽 --> <div class = 'title' >{{ $title }}</div> <div class = 'content' >{{ $content }}</div> </div> |
2、使用組件
1
2
3
4
5
6
7
8
9
10
11
12
13
|
// 路徑:Laravel/resources/views/test.blade.php @component( 'component' ) @slot( 'title' ) 組件標題 @endsolt @slot( 'content' ) 組件內容 @endslot @endcomponent |
2.數據顯示
2.1 轉義輸出
{{ $name }}
2.2 未轉義輸出
{!! $name !!}
2.3 打印內容并帶一個默認值
{{ $var or 'default' }}
2.4 原格式輸出
1
2
3
4
5
6
7
8
9
|
// 第一種(適合量不多): @{{ name }} // 第二種(適合量多): @verbatim {{ name }} {{ sex }} {{ age }} @endverbatim |
3. 流程控制
3.1 for
1
2
3
|
@ for ( $i = 0; $i < 10; ++ $i ) {{ $i }} <br /> @ endfor |
3.2 foreach
1
2
3
|
@ foreach ( $data as $k => $v ) {{ $k }} <br /> @ endforeach |
3.3 forelse
1
2
3
4
5
6
|
@ foreach ( $data as $k => $v ) // $data有值 {{ $k }} <br /> @ empty // $data沒有值 @ endforeach |
3.4 if
@if(condition) - if開始
@else - else不帶條件
@elseif(condition) - else帶條件
@endif - 結束if
3.5 while
@while(condition) - while循環(huán)開始
@endwhile - while循環(huán)結束
3.6 unless
@unless(condition) - unless開始
@endunless - unless結束
4. 使用原生 PHP
1
2
3
4
|
@php // 里面寫php代碼 echo "使用原生 PHP" ; @endphp |
5. 包含子視圖
被包含的子視圖可以引用父視圖定義的所有變量。
你可以傳遞額外的數據到子視圖
定義父視圖 parent.blade.php,并包含子視圖 child.blade.php,且傳入額外數據
1
2
3
4
|
<!-- 包含子視圖 --> @ include ( "child" , [ "other" => "額外數據" ]) |
總結
到此這篇關于laravel中blade模板帶條件分頁的文章就介紹到這了,更多相關laravel blade模板內容請搜索服務器之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持服務器之家!
原文鏈接:https://juejin.im/post/5e5730ba51882548ff3a9a2c