Blade 模板
Blade 模板
简介
Blade 是 Laravel 提供的一个简单而又强大的模板引擎。和其他流行的 PHP 模板引擎不同,Blade 并不限制你在视图中使用原生 PHP 代码。所有 Blade 视图文件都将被编译成原生的 PHP 代码并缓存起来,除非它被修改,否则不会重新编译,这就意味着 Blade 基本上不会给你的应用增加任何负担。Blade 视图文件使用.blade.php
作为文件扩展名,被存放在 resources/views
目录。
模板继承
定义布局
首先,我们来研究一个「主」页面布局。因为大多数 web
应用会在不同的页面中使用相同的布局方式,因此可以很方便地定义单个 Blade 布局视图:
<!-- Stored in resources/views/layouts/app.blade.php -->
<html>
<head>
<title>App Name - @yield('title')</title>
</head>
<body>
@section('sidebar')
This is the master sidebar.
@show
<div class="container">
@yield('content')
</div>
</body>
</html>
你可以看见,这段程序里包含常见的 HTML。但请注意 @section
和 @yield
和指令。如同 section 的意思,一个片段,@section
指令定义了片段的内容, 而 @yield
指令则用来显示片段的内容。
现在,我们已经定义好了这个应用程序的布局,接下来,我们定义一个继承此布局的子页面。
继承布局
在定义一个子视图时,使用 Blade 的 @extends
指令指定子视图要「继承」的视图。扩展自 Blade 布局的视图可以使用 @section
指令向布局片段注入内容。就如前面的示例中所示,这些片段的内容将由布局中的 @yield
指令控制显示:
<!-- Stored in resources/views/child.blade.php -->
@extends('layouts.app')
@section('title', 'Page Title')
@section('sidebar')
@parent
<p>This is appended to the master sidebar.</p>
@endsection
@section('content')
<p>This is my body content.</p>
@endsection
在这个示例中, sidebar
片段利用 @parent
指令向布局的 sidebar 追加(而非覆盖)内容。 在渲染视图时,@parent 指令将被布局中的内容替换。
技巧:和上一个示例相反,这里的
sidebar
片段使用@endsection
代替@show
来结尾。@endsection
指令仅定义了一个片段,@show
则在定义的同时 立即yield
这个片段。
@yield
指令还接受一个默认值作为第二个参数。如果被 「yield」的片段未定义,则该默认值被渲染:
@yield('content', View::make('view.name'))
Blade 视图可以用 view
辅助函数从路由中返回:
Route::get('blade', function () {
return view('child');
});
显示数据
你可以把变量置于花括号中以在视图中显示数据。 例如,给定下方的路由:
Route::get('greeting', function () {
return view('welcome', ['name' => 'Samantha']);
});
您可以像如下这样显示 name
变量的内容:
Hello, {{ $name }}.
技巧:Blade 的
{{ }}
语句将被 PHP 的htmlspecialchars
函数自动转义以防范 XSS 攻击。
不仅仅可以显示传递给视图的变量的内容,您亦可输出任何 PHP 函数的结果。事实上,您可以在 Blade 模板的回显语句放置任何 PHP 代码:
The current UNIX timestamp is {{ time() }}.
显示非转义字符
默认情况下, Blade {{ }}
语句将被 PHP 的 htmlspecialchars
函数自动转义以防范 XSS 攻击。如果您不想您的数据被转义,那么您可使用如下的语法:
Hello, {!! $name !!}.
注意:在应用中显示用户提供的数据时请格外小心,请尽可能的使用转义和双引号语法来防范 XSS 攻击。
渲染 JSON
有时,为了初始化一个 JavaScript 变量,您可能会向视图传递一个数组并将其渲染成 JSON 。例如:
<script>
var app = <?php echo json_encode($array); ?>;
</script>
当然,您亦可使用 @json
Blade 指令来代替手动调用 json_encode
方法。 @json
指令的参数和 PHP 的 json_encode
函数一致:
<script>
var app = @json($array);
var app = @json($array, JSON_PRETTY_PRINT);
</script>
注意:使用
@json
指令时,您应该只渲染已经存在的变量为 JSON 。 Blade 模板是基于正则表达式的,如果尝试将一个复杂表达式传递给@json
指令可能会导致无法预测的错误。
HTML 实体编码
默认情况下, Blade (以及 Laravel 的 e
辅助函数)将会对 HTML 实体进行双重编码。如果您想要禁用此举,您可以在 AppServiceProvider
中的 boot
方法中调用 Blade::withoutDoubleEncoding
方法:
<?php
namespace App\Providers;
use Illuminate\Support\Facades\Blade;
use Illuminate\Support\ServiceProvider;
class AppServiceProvider extends ServiceProvider
{
/**
* 驱动应用服务。
*
* @return void
*/
public function boot()
{
Blade::withoutDoubleEncoding();
}
}
Blade & JavaScript 框架
由于许多 JavaScript 框架也使用「花括号」来标识将显示在浏览器中的表达式,因此,您可以使用 @
符号来表示 Blade 渲染引擎应当保持不便。例如:
<h1>Laravel</h1>
Hello, @{{ name }}.
在这个例子中, @
符号将被 Blade 移除;当然,Blade 将不会修改 {{ name }}
表达式,取而代之的是 JavaScript 模板来对其进行渲染。
@
符号也用于转义 Blade 指令:
{{-- Blade --}}
@@json()
<!-- HTML 输出 -->
@json()
@verbatim
指令
如果您在模板中显示很大一部分 JavaScript 变量,您可以将 HTML 嵌入到 @verbatim
指令中,这样,您就不需要在每一个 Blade 回显语句前添加 @
符号:
@verbatim
<div class="container">
Hello, {{ name }}.
</div>
@endverbatim
控制结构
除了模板继承和显示数据以外, Blade 还为常见的 PHP 控制结构提供了便捷的快捷方式,例如条件语句和循环。这些快捷方式为 PHP 控制结构提供了一个非常清晰、简洁的书写方式,同时,还与 PHP 中的控制结构保持了相似的语法特性。
If 语句
您可以使用 @if
, @elseif
, @else
和 @endif
指令构造 if
语句。这些指令功能与它们所对应的 PHP 语句完全一致:
@if (count($records) === 1)
I have one record!
@elseif (count($records) > 1)
I have multiple records!
@else
I don't have any records!
@endif
为了方便, Blade 还提供了一个 @unless
指令:
@unless (Auth::check())
You are not signed in.
@endunless
除了已经讨论过了的条件指令外, @isset
和 @empty
指令亦可作为它们所对应的 PHP 函数的快捷方式:
@isset($records)
// $records 已经定义但不为空
@endisset
@empty($records)
// $records 为空……
@endempty
鉴权指令
@auth
和 @guest
指令可用于快速判断当前用户是否已经获得授权或是当前用户是游客:
@auth
// 用户已经通过认证……
@endauth
@guest
// 用户没有通过认证……
@endguest
如有需要,您亦可在使用 @auth
和 @guest
指令时指定 鉴权守卫:
@auth('admin')
// 用户已经通过认证
@endauth
@guest('admin')
// 用户没有通过认证……
@endguest
区块指令
您可以使用 @hasSection
指令来判断区块是否有内容:
@hasSection('navigation')
<div class="pull-right">
@yield('navigation')
</div>
<div class="clearfix"></div>
@endif
您可以使用 sectionMissing
指令来判断区块是否没有内容:
@sectionMissing('navigation')
<div class="pull-right">
@include('default-navigation')
</div>
@endif
环境指令
您可以使用 @production
指令来判断应用是否处于生产环境:
@production
// 生产环境特定内容……
@endproduction
或者,您可以使用 @env
指令来判断应用是否运行于指定的环境:
@env('staging')
// 应用运行于「staging」环境……
@endenv
@env(['staging', 'production'])
// 应用运行于 「staging」环境或生产环境……
@endenv
Switch 语句
您可使用 @switch
, @case
, @break
, @default
和 @endswitch
语句来构造 Switch 语句:
@switch($i)
@case(1)
First case...
@break
@case(2)
Second case...
@break
@default
Default case...
@endswitch
循环
除了条件语句, Blade 还提供了与 PHP 循环结构功能相同的指令。同样,这些语句的功能和它们所对应的 PHP 语法一致:
@for ($i = 0; $i < 10; $i++)
The current value is {{ $i }}
@endfor
@foreach ($users as $user)
<p>This is user {{ $user->id }}</p>
@endforeach
@forelse ($users as $user)
<li>{{ $user->name }}</li>
@empty
<p>No users</p>
@endforelse
@while (true)
<p>I'm looping forever.</p>
@endwhile
技巧:循环时,您可以使用 循环变量 去获取有关循环的有价值的信息,例如,您处于循环的第一个迭代亦或是处于最后一个迭代。
在使用循环的时候,您可以终止循环或跳过当前迭代:
@foreach ($users as $user)
@if ($user->type == 1)
@continue
@endif
<li>{{ $user->name }}</li>
@if ($user->number == 5)
@break
@endif
@endforeach
您可以在指令的单独一行中声明一个条件语句:
@foreach ($users as $user)
@continue($user->type == 1)
<li>{{ $user->name }}</li>
@break($user->number == 5)
@endforeach
Loop 变量
循环时,循环内部可以使用 $loop
变量。该变量提供了访问一些诸如当前的循环索引和此次迭代是首次或是末次这样的信息的方式:
@foreach ($users as $user)
@if ($loop->first)
This is the first iteration.
@endif
@if ($loop->last)
This is the last iteration.
@endif
<p>This is user {{ $user->id }}</p>
@endforeach
如果您在嵌套循环中,您可以使用循环的 $loop
的变量的 parent
属性访问父级循环:
@foreach ($users as $user)
@foreach ($user->posts as $post)
@if ($loop->parent->first)
This is first iteration of the parent loop.
@endif
@endforeach
@endforeach
$loop
变量还包含各种各样有用的属性:
属性 | 描述 |
---|---|
$loop->index |
当前迭代的索引(从 0 开始)。 |
$loop->iteration |
当前循环的迭代次数(从 1 开始)。 |
$loop->remaining |
循环剩余的迭代次数。 |
$loop->count |
被迭代的数组的元素个数。 |
$loop->first |
当前迭代是否是循环的首次迭代。 |
$loop->last |
当前迭代是否是循环的末次迭代。 |
$loop->even |
当前循环的迭代次数是否是偶数。 |
$loop->odd |
当前循环的迭代次数是否是奇数。 |
$loop->depth |
当前循环的嵌套深度。 |
$loop->parent |
嵌套循环中的父级循环。 |
注释
Blade 也允许您在视图中定义注释。但是,和 HTML 注释不同, Blade 注释不会被包含在应用返回的 HTML 中:
{{-- This comment will not be present in the rendered HTML --}}
PHP
在许多情况下,嵌入 PHP 代码到您的视图中是很有用的。您可以在模板中使用 Blade 的 @php
指令执行原生的 PHP 代码块:
@php
//
@endphp
技巧:尽管 Blade 提供了这个功能,频繁使用它可能使得您的模板中嵌入过多的逻辑。
@once
指令
@once
指令允许您定义模板的一部分内容,这部分内容在每一个渲染周期中只会被计算一次。该指令在使用 堆栈 推送一段特定的 JavaScript 代码到页面的头部环境下是很有用的。例如,如果您想要在循环中渲染一个特定的 组件 ,您可能希望仅在组件渲染的首次推送 JavaScript 代码到头部:
@once
@push('scripts')
<script>
// 您自定义的 JavaScript 代码
</script>
@endpush
@endonce
表单
CSRF 域
任何您在应用中定义 HTML 表单的时候,您都应该在表单中包含一个隐藏的 CSRF token 域,这样一来, CSRF 保护 中间件便能校验请求。您可以使用 @csrf
Blade 指令来生成一个 token 域:
<form method="POST" action="/profile">
@csrf
...
</form>
方法域
由于 HTML 表单不能够构造 PUT
, PATCH
或 DELETE
请求,您需要添加隐藏的 _method
域来模拟这些 HTTP 动作。您亦可使用 @method
Blade 指令来创建这个方法域:
<form action="/foo/bar" method="POST">
@method('PUT')
...
</form>
校验错误
@error
指令可用于快速检查指定属性是否存在 校验错误信息 。在 @error
指令中,您可以回显 $message
变量来显示错误信息:
<!-- /resources/views/post/create.blade.php -->
<label for="title">Post Title</label>
<input id="title" type="text" class="@error('title') is-invalid @enderror">
@error('title')
<div class="alert alert-danger">{{ $message }}</div>
@enderror
您可以将 指定错误包的名称 作为 @error
指令的第二个参数来检索含有多个表单的页面的验证错误信息:
<!-- /resources/views/auth.blade.php -->
<label for="email">Email address</label>
<input id="email" type="email" class="@error('email', 'login') is-invalid @enderror">
@error('email', 'login')
<div class="alert alert-danger">{{ $message }}</div>
@enderror
组件
组件和插槽的作用与区块和布局的作用一致;不过,有些人可能觉者组件和插槽更易于理解。有两种书写组件的方法:基于类的组件和匿名组件。
您可以使用 make:component
Artisan 命令来创建一个基于类的组件。我们将会创建一个简单的 Alert
组件用于说明如何使用组件。make:component
命令将会把组件置于 App\View\Components
目录中:
php artisan make:component Alert
make:component
命令将会为组件创建一个视图模板。创建的视图被置于 resources/views/components
目录中。
手动注册包组件
当为您自己的应用编写组件的时候,Laravel 将会自动发现位于 app/View/Components
目录和 resources/views/components
目录中的组件。
当然,如果您使用 Blade 组件编译一个包,您可能需要手动注册组件类及其 HTML 标签别名。您应该在包的服务提供者的 boot
方法中注册您的组件:
use Illuminate\Support\Facades\Blade;
/**
* 驱动您的包的服务
*/
public function boot()
{
Blade::component('package-alert', AlertComponent::class);
}
当组件注册完成后,便可使用标签别名来对其进行渲染。
<x-package-alert/>
显示组件
要显示一个组件,您可以在 Blade 模板中使用 Blade 组件标签。 Blade 组件以 x-
字符串开始,其后紧接组件类 kebab case 形式的名称(即单词与单词之间使用短横线 -
进行连接):
<x-alert/>
<x-user-profile/>
如果组件位于 App\View\Components
目录的子目录中,您可以使用 .
字符来指定目录层级。例如,假设我们有一个组件位于 App\View\Components\Inputs\Button.php
,那么我们可以像这样渲染它:
<x-inputs.button/>
传递数据到组件中
您可以使用 HTML 属性传递数据到 Blade 组件中。普通的值可以通过简单的 HTML 属性来传递给组件。PHP 表达式和变量应该通过以 :
字符作为前缀的变量来进行传递:
<x-alert type="error" :message="$message"/>
您应该在类的构造器中定义组件的必要数据。在组件的视图中,组件的所有 public 类型的属性都是可用的。不必通过组件类的 render
方法传递:
<?php
namespace App\View\Components;
use Illuminate\View\Component;
class Alert extends Component
{
/**
* alert 类型。
*
* @var string
*/
public $type;
/**
* alert 消息。
*
* @var string
*/
public $message;
/**
* 创建一个组件实例。
*
* @param string $type
* @param string $message
* @return void
*/
public function __construct($type, $message)
{
$this->type = $type;
$this->message = $message;
}
/**
* 获取组件的视图 / 内容
*
* @return \Illuminate\View\View|\Closure|string
*/
public function render()
{
return view('components.alert');
}
}
渲染组件时,您可以回显变量名来显示组件的 public 变量的内容:
<div class="alert alert-{{ $type }}">
{{ $message }}
</div>
命名方式(Casing)
组件的构造器的参数应该使用 驼峰式
类型,在 HTML 属性中引用参数名时应该使用 烤串式
类型(kebab-case :单词与单词之间使用短横线 -
进行连接)。例如,给定如下的组件构造器:
/**
* 创建一个组件实例
*
* @param string $alertType
* @return void
*/
public function __construct($alertType)
{
$this->alertType = $alertType;
}
$alertType
参数可以像这样使用:
<x-alert alert-type="danger" />
组件方法
除了在组件模板中可以使用 public 类型的变量以外,任何 public 类型的方法亦可在模板中执行。例如,假设某组件拥有 isSelected
方法:
/**
* 判断给定的选项是否是当前选中的选项
*
* @param string $option
* @return bool
*/
public function isSelected($option)
{
return $option === $this->selected;
}
您可以通过调用与方法名称相同的变量名来执行这个方法:
<option {{ $isSelected($value) ? 'selected="selected"' : '' }} value="{{ $value }}">
{{ $label }}
</option>
在类中使用属性 & 插槽
Blade 组件也允许您在类的渲染方法中访问组件的名称,属性以及插槽。当然,为了访问这个数据,您应该在组件的 render
方法中返回一个闭包函数。这个闭包函数接收一个名为 $data
的数组作为它唯一的参数:
/**
* 获取组件的视图 / 内容
*
* @return \Illuminate\View\View|\Closure|string
*/
public function render()
{
return function (array $data) {
// $data['componentName'];
// $data['attributes'];
// $data['slot'];
return '<div>Component content</div>';
};
}
componentName
等于使用 x-
作为前缀后 HTML 标签中使用的名称。 attributes
元素包含所有可能出现在 HTML 标签中的属性。 slot
元素是一个 Illuminate\Support\HtmlString
实例,该实例包含组件中的插槽定义的内容。
附加依赖
如果您的组件需要使用 服务容器 中的依赖,您可以在组件所有数据属性前将其列出,服务容器会自动将其注入:
use App\Services\AlertCreator
/**
* 创建一个组件实例。
*
* @param \App\Services\AlertCreator $creator
* @param string $type
* @param string $message
* @return void
*/
public function __construct(AlertCreator $creator, $type, $message)
{
$this->creator = $creator;
$this->type = $type;
$this->message = $message;
}
管理属性
我们已经讨论了如何通过属性传递数据给组件;然而,有时您可能需要指定一个诸如 class
的额外的 HTML 属性,这些属性不是组件所必须的数据。此时,您可能想要将这些可选的属性向下传递到组件模板的根元素中。例如,我们想要像这样渲染一个 alert
组件:
<x-alert type="error" :message="$message" class="mt-4"/>
所有不属于组件的构造器的属性都将被自动添加到组件的「属性包」中。该属性包将通过 $attributes
变量自动传递给组件。您可以通过回显这个变量来渲染所有的属性:
<div {{ $attributes }}>
<!-- Component Content -->
</div>
注意:此时不支持在组件中使用诸如
@env
这样的指令。
默认 / 合并属性
某些时候,你可能需要指定属性的默认值,或将其他值合并到组件的某些属性中。为此,你可以使用属性包的 merge
方法:
<div {{ $attributes->merge(['class' => 'alert alert-'.$type]) }}>
{{ $message }}
</div>
假设我们如下方所示使用该组件:
<x-alert type="error" :message="$message" class="mb-4"/>
最终呈现的组件 HTML 将如下所示:
<div class="alert alert-error mb-4">
<!-- Contents of the $message variable -->
</div>
过滤属性
你可以使用 filter
方法过滤属性。如果你想在属性包中保留属性,这个方法接受一个应该返回 true
的闭包:
{{ $attributes->filter(fn ($value, $key) => $key == 'foo') }}
为了方便,你也可以使用 whereStartsWith
方法来检索所有以特定字符串开头的键所对应的属性:
{{ $attributes->whereStartsWith('wire:model') }}
使用 first
方法,你可以渲染一个属性包中的第一个属性:
{{ $attributes->whereStartsWith('wire:model')->first() }}
插槽
通常,你需要通过 「slots」 向组件传递附加内容。 假设我们创建的 alert
组件具有以下标记:
<!-- /resources/views/components/alert.blade.php -->
<div class="alert alert-danger">
{{ $slot }}
</div>
我门可以通过向组件注入内容的方式,将内容传递到 slot
:
<x-alert>
<strong>Whoops!</strong> Something went wrong!
</x-alert>
有时候一个组件可能需要在它内部的不同位置放置多个不同的插槽。我们来修改一下 alert 组件,使其允许注入 「title」:
<!-- /resources/views/components/alert.blade.php -->
<span class="alert-title">{{ $title }}</span>
<div class="alert alert-danger">
{{ $slot }}
</div>
您可以使用 x-slot
标签来定义命名插槽的内容。任何没有在 x-slot
标签中的内容都将传递给 $slot
变量中的组件:
<x-alert>
<x-slot name="title">
Server Error
</x-slot>
<strong>Whoops!</strong> Something went wrong!
</x-alert>
作用域插槽
如果您使用诸如 Vue 这样的 JavaScript 框架,那么您应该很熟悉「作用域插槽」,它允许您从插槽中的组件访问数据或者方法。 Laravel 中也有类似的用法,只需在您的组件中定义 public 方法或属性,并且使用 $component
变量来访问插槽中的组件:
<x-alert>
<x-slot name="title">
{{ $component->formatAlert('Server Error') }}
</x-slot>
<strong>Whoops!</strong> Something went wrong!
</x-alert>
内联组件视图
对于小型组件而言,管理组件类和组件视图模板可能会很麻烦。因此,您可以从 render
方法中返回组件的内容:
/**
* 获取组件的视图 / 内容。
*
* @return \Illuminate\View\View|\Closure|string
*/
public function render()
{
return <<<'blade'
<div class="alert alert-danger">
{{ $slot }}
</div>
blade;
}
生成内联视图组件
要创建一个渲染内联视图的组件,您可以在运行 make:component
命令时使用 inline
选项:
php artisan make:component Alert --inline
匿名组件
与行内组件相同,匿名组件提供了一个通过单个文件管理组件的机制。然而,匿名组件使用的是一个没有关联类的单一视图文件。要定义一个匿名组件,您只需将 Blade 模板置于 resources/views/components
目录下。例如,假设您在 resources/views/components/alert.blade.php
中定义了一个组件:
<x-alert/>
如果组件在 components
目录的子目录中,您可以使用 .
字符来指定其路径。例如,假设组件被定义在 resources/views/components/inputs/button.blade.php
中,您可以像这样渲染它:
<x-inputs.button/>
数据 / 属性
由于匿名组件没有任何关联类,您可能想要区分哪些数据应该被作为变量传递给组件,而哪些属性应该被存放于 属性包 中。
您可以在组件的 Blade 模板的顶层使用 @props
指令来指定哪些属性应该作为数据变量。组件中的其他属性都将通过属性包的形式提供。如果您想要为某个数据变量指定一个默认值,您可以将属性名作为数组键,默认值作为数组值来实现:
<!-- /resources/views/components/alert.blade.php -->
@props(['type' => 'info', 'message'])
<div {{ $attributes->merge(['class' => 'alert alert-'.$type]) }}>
{{ $message }}
</div>
动态组件
有时,您可能需要渲染一个组件,但在运行前不知道要渲染哪一个。这种情况下,您可以使用 Laravel 内置的 dynamic-component
组件来渲染一个基于值或变量的组件:
<x-dynamic-component :component="$componentName" class="mt-4" />
引入子视图
Blade 的 @include
指令可用于从另一个视图包含一个 Blade 视图。子视图将继承父视图中所有可用的变量:
<div>
@include('shared.errors')
<form>
<!-- Form Contents -->
</form>
</div>
除了子视图继承父视图中所有可用的数据,您亦可通过数组将数据传递给子视图:
@include('view.name', ['some' => 'data'])
如果您尝试 @include
一个不存在的视图,Laravel 将会报错。如果您想要包含一个不确定是否存在的视图时,您可以使用 @includeIf
指令:
@includeIf('view.name', ['some' => 'data'])
如果想要在某个表达式的值计算为 true
时 @include
一个视图,您可以使用 @includeWhen
指令:
@includeWhen($boolean, 'view.name', ['some' => 'data'])
如果想要在某个表达式的值计算为 false
时 @include
一个视图,您可以使用 @includeUnless
指令:
@includeUnless($boolean, 'view.name', ['some' => 'data'])
要包含指定的视图数组中的第一个视图,可以使用 includeFirst
指令:
@includeFirst(['custom.admin', 'admin'], ['some' => 'data'])
注意:您应该避免在 Blade 视图中使用
__DIR__
和__FILE__
常量,因为它们会引用本地已经缓存了的,编译过了的视图的路径。
给子视图取别名
如果您的 Blade 包含了一个存储于子目录中的视图,您可能希望给它们取一个别名以方便访问。例如,假设存储于 resources/views/includes/input.blade.php
的视图拥有如下内容:
<input type="{{ $type ?? 'text' }}">
您可以使用 include
为 includes.input
取一个名为 input
的别名。通常情况下,这需要在 AppServiceProvider
中的 boot
方法中完成:
use Illuminate\Support\Facades\Blade;
Blade::include('includes.input', 'input');
一旦您为子视图取了别名,您便可在 Blade 指令中使用别名来对其进行渲染:
@input(['type' => 'email'])
为集合渲染视图
您可以使用 Blade 的 @each
指令将循环合并在一行内:
@each('view.name', $jobs, 'job')
第一个参数是数组或集合中的元素的要渲染的视图片段。第二个参数是您想要迭代的数组或集合,当第三个参数是一个表示当前迭代的视图的变量名。因此,如果您遍历一个名为 jobs
的数组,通常会在视图片段中使用 job
变量来访问每一个 job (jobs 数组的元素)。在您的视图片段中,可以使用 key
变量来访问当前迭代的键。
您亦可传递第四个参数给 @each
指令。当给定的数组为空时,将会渲染该参数所对应的视图。
@each('view.name', $jobs, 'job', 'view.empty')
注意:通过
@each
指令渲染的视图不会继承父视图的变量。如果子视图需要使用这些变量,您可以使用@foreach
和@include
来代替它。
视图堆栈
Blade 允许您将视图推送到堆栈中,它们可以在其他视图或布局中进行渲染。这在子视图中需要指定 JavaScript 库时非常有用:
@push('scripts')
<script src="/example.js"></script>
@endpush
您亦可按需进行多次推送。请 @stack
指令来完整堆栈内容的渲染:
<head>
<!-- Head Contents -->
@stack('scripts')
</head>
如果您想要预置内容于栈顶,您可以使用 @prepend
指令:
@push('scripts')
This will be second...
@endpush
// Later...
@prepend('scripts')
This will be first...
@endprepend
服务注入
@inject
指令可用于从 Laravel 的 服务容器 中检索服务。传递给 @inject
的第一个参数是将要置入的服务的变量名,第二个参数可以是您想要解析的类名或接口名:
@inject('metrics', 'App\Services\MetricsService')
<div>
Monthly Revenue: {{ $metrics->monthlyRevenue() }}.
</div>
扩展 Blade
Blade 允许您使用 directive
方法来自定义指令。当 Blade 编译器遇到自定义指令时,将会调用其包含的表达式提供的回调。
下方的例子创建了一个 @datetime($var)
指令,其用于格式化指定的 DateTime
实例 $var
:
<?php
namespace App\Providers;
use Illuminate\Support\Facades\Blade;
use Illuminate\Support\ServiceProvider;
class AppServiceProvider extends ServiceProvider
{
/**
* 注册应用服务。
*
* @return void
*/
public function register()
{
//
}
/**
* 驱动应用服务。
*
* @return void
*/
public function boot()
{
Blade::directive('datetime', function ($expression) {
return "<?php echo ($expression)->format('m/d/Y H:i'); ?>";
});
}
}
如您所见,我们将在任何被传递给该指令的表达式中链式调用 format
方法。因此,在这个例子中,最终该指令生成的 PHP 代码如下:
<?php echo ($var)->format('m/d/Y H:i'); ?>
注意:在更新了 Blade 指令的逻辑后,您需要删除所有的 Blade 视图缓存。您可以通过
view:clear
Artisan 命令来实现。
自定义 If 语句
在定义一个简单的自定义的条件语句时,编写自定义指令可能会比必要的步骤还要复杂。因此, Blade 提供了一个 Blade::if
方法,它允许您使用闭包快速自定义一个条件指令。例如,让我们自定义一个检查当前应用的云服务商的条件指令。我们可以在 AppServiceProvider
中的 boot
方法中这样做:
use Illuminate\Support\Facades\Blade;
/**
* 驱动应用服务。
*
* @return void
*/
public function boot()
{
Blade::if('cloud', function ($provider) {
return config('filesystems.default') === $provider;
});
}
当自定义条件语句完成定义后,我们可以在模板中方便地使用它们:
@cloud('digitalocean')
// 应用使用 digitalocean 云服务商……
@elsecloud('aws')
// 应用使用 aws 云服务商……
@else
// 应用没有使用 digitalocean 亦没有使用 aws 提供的云服务……
@endcloud
@unlesscloud('aws')
// 应用没有使用 aws 提供的云服务……
@endcloud
本译文仅用于学习和交流目的,转载请务必注明文章译者、出处、和本文链接
我们的翻译工作遵照 CC 协议,如果我们的工作有侵犯到您的权益,请及时联系我们。
推荐文章: