Blade 模板引擎详解

Blade 是 Laravel 框架提供的一个简单但功能强大的模板引擎。以下是详细介绍:

1. 基本语法

变量输出

{{ $variable }}  // 转义输出
{!! $variable !!}  // 非转义输出

注释

{{-- 这是 Blade 注释,不会显示在 HTML 中 --}}

2. 控制结构

条件语句

@if($user->isAdmin)
    <h1>管理员您好</h1>
@elseif($user->isModerator)
    <h1>版主您好</h1>
@else
    <h1>用户您好</h1>
@endif

{{-- 除非语句 --}}
@unless(Auth::check())
    请先登录
@endunless

{{-- 存在判断 --}}
@isset($records)
    // records 存在时执行
@endisset

循环语句

@foreach($users as $user)
    <p>用户名: {{ $user->name }}</p>
@endforeach

@forelse($users as $user)
    <p>{{ $user->name }}</p>
@empty
    <p>没有用户</p>
@endforelse

@for($i = 0; $i < 10; $i++)
    当前是第 {{ $i }} 次循环
@endfor

@while($condition)
    <p>循环内容</p>
@endwhile

3. 布局和继承

定义布局

<!DOCTYPE html>
<html>
<head>
    <title>@yield('title')</title>
</head>
<body>
    <div class="sidebar">
        @section('sidebar')
            这是主布局的侧边栏
        @show
    </div>

    <div class="content">
        @yield('content')
    </div>
</body>
</html>

继承布局

@extends('layouts.app')

@section('title', '首页')

@section('sidebar')
    @parent {{-- 保留父级内容 --}}
    <p>这是附加的侧边栏内容</p>
@endsection

@section('content')
    <h1>欢迎访问首页</h1>
@endsection

4. 组件和插槽

定义组件

<div class="alert alert-{{ $type }}">
    {{ $slot }}

    @if(isset($footer))
        <div class="alert-footer">
            {{ $footer }}
        </div>
    @endif
</div>

使用组件

<x-alert type="error">
    <p>发生错误!</p>

    <x-slot:footer>
        <button>关闭</button>
    </x-slot>
</x-alert>

5. 包含子视图

@include('shared.errors')

{{-- 带参数包含 --}}
@include('view.name', ['status' => 'complete'])

{{-- 条件包含 --}}
@includeWhen($boolean, 'view.name')

6. 实用示例

用户列表页面

@extends('layouts.app')

@section('content')
    <div class="user-list">
        @forelse($users as $user)
            <div class="user-card">
                <h3>{{ $user->name }}</h3>

                @if($user->isVerified)
                    <span class="badge">已认证</span>
                @endif

                <div class="user-info">
                    <p>邮箱:{{ $user->email }}</p>
                    <p>注册时间:{{ $user->created_at->format('Y-m-d') }}</p>
                </div>

                @can('edit', $user)
                    <a href="{{ route('users.edit', $user) }}" class="btn">编辑</a>
                @endcan
            </div>
        @empty
            <p class="no-data">暂无用户数据</p>
        @endforelse

        {{ $users->links() }}
    </div>
@endsection

7. 特殊功能

堆栈

{{-- 在布局中定义堆栈 --}}
@stack('scripts')

{{-- 在子视图中推送内容到堆栈 --}}
@push('scripts')
    <script src="/example.js"></script>
@endpush

服务注入

@inject('metrics', 'App\Services\MetricsService')

<div>
    每月访问量:{{ $metrics->monthlyVisits() }}
</div>

Blade 模板引擎的优点:

  1. 语法简洁直观
  2. 自动转义,防止 XSS 攻击
  3. 强大的布局和组件系统
  4. 可扩展性强
  5. 性能优秀(模板会被编译成原生 PHP 代码)
  6. 与 Laravel 框架完美集成

这些特性使得 Blade 成为一个非常受欢迎的 PHP 模板引擎,特别适合构建现代化的 Web 应用程序。


学习目标

通过系统化的练习题帮助学习者掌握 Blade 模板引擎的核心概念和使用方法。

使用说明

请认真阅读每道题目,结合解析和原文加深理解。

题目与解析

知识点: Blade 基本语法 – 变量输出
题目: 在 Blade 模板中,以下哪种语法用于安全转义输出变量?
A. {!! $variable !!}
B. {{ $variable }}
C. <?= $variable ?>
D. {% $variable %}

正确答案: B
原文依据:“{{ $variable }} // 转义输出”(出自:基本语法,第1节)
解析: Blade 提供了两种变量输出方式,其中 {{ $variable }} 会对输出进行 HTML 转义,这是推荐的安全做法。而 {!! $variable !!} 则是非转义输出,在确保内容安全的情况下才使用。

知识点: 控制结构 – 条件语句
题目: 在 Blade 中,下列哪个语句用于检查变量是否存在?
A. @exists
B. @isset
C. @has
D. @check

正确答案: B
原文依据:“@isset($records) // records 存在时执行 @endisset”(出自:控制结构,第2节)
解析: @isset 指令用于检查变量是否被设置且不为 null,这是 Blade 提供的一个语法糖,等同于 PHP 的 isset() 函数。

知识点: 循环语句
题目: 当需要处理空数组情况时,应该使用哪个循环结构?
A. @foreach
B. @while
C. @forelse
D. @for

正确答案: C
原文依据:

"@forelse($users as $user) <p>{{ $user->name }}</p> @empty <p>没有用户</p> @endforelse"(出自:控制结构,第2节)


解析: @forelse 提供了处理空集合的优雅方式,通过 @empty 指令可以定义当集合为空时显示的内容,比单纯的 @foreach 更灵活。

知识点: 布局和继承
题目: 在 Blade 布局中,使用哪个指令可以在子模板中保留父模板的内容?
A. @include
B. @extends
C. @parent
D. @yield

正确答案: C
原文依据:“@parent {{– 保留父级内容 –}}”(出自:布局和继承,第3节)
解析: 当我们想在子模板中扩展父模板的 section 内容而不是完全覆盖时,可以使用 @parent 指令。这样可以在保留父模板内容的同时添加新的内容。

知识点: 组件系统
题目: 在 Blade 组件中,如何定义具名插槽?
A. content
B. content
C. @slot(‘name’)content@endslot
D. @section(‘name’)content@endsection

正确答案: B
原文依据:“关闭”(出自:组件和插槽,第4节)
解析: Blade 组件系统中使用 语法来定义具名插槽,这允许我们在组件中指定多个不同的内容区域。这是 Blade 组件系统的一个强大特性。

知识点: 包含子视图
题目: 如何在 Blade 模板中根据条件包含子视图?
A. @include-if($condition, ‘view.name’)
B. @includeWhen($boolean, ‘view.name’)
C. @includeMaybe(‘view.name’, $condition)
D. @if($condition)@include(‘view.name’)@endif

正确答案: B
原文依据:“@includeWhen($boolean, ‘view.name’)”(出自:包含子视图,第5节)
解析: @includeWhen 是 Blade 提供的一个优雅的条件包含指令,它结合了条件判断和视图包含的功能,使代码更简洁。

知识点: 堆栈功能
题目: 在 Blade 中,以下哪种方式可以向堆栈添加内容?
A. @stack(‘content’)
B. @section(‘stack’, ‘content’)
C. @push(‘scripts’)
D. @yield(‘stack’)

正确答案: C
原文依据:“@push(‘scripts’)@endpush”(出自:特殊功能,第7节)
解析: @push 指令用于向指定的堆栈中添加内容。这在需要在不同位置收集脚本或样式等内容时特别有用。

知识点: 服务注入
题目: Blade 中如何注入服务类?
A. @service(‘name’)
B. @include(‘service’)
C. @inject(‘name’, ‘ServiceClass’)
D. @use(‘ServiceClass’)

正确答案: C
原文依据:“@inject(‘metrics’, ‘App\Services\MetricsService’)”(出自:特殊功能,第7节)
解析: @inject 指令允许我们直接在视图中注入服务类,这使得在视图中可以方便地访问服务提供的功能。

知识点: 变量转义
题目: 当需要输出未转义的 HTML 内容时,应使用哪种语法?
A. {{ $html }}
B. {{{ $html }}}
C. {!! $html !!}
D. @html($html)

正确答案: C
原文依据:“{!! $variable !!} // 非转义输出”(出自:基本语法,第1节)
解析: {!! $html !!} 语法用于输出未经 HTML 转义的内容。但要注意,这种方式应该谨慎使用,只在确保内容安全的情况下使用,以防 XSS 攻击。

知识点: 布局继承
题目: 在子模板中使用哪个指令来继承父布局?
A. @parent
B. @extends
C. @include
D. @layout

正确答案: B
原文依据:“@extends(‘layouts.app’)”(出自:继承布局,第3节)
解析: @extends 指令用于指定子模板要继承的父布局。这是 Blade 模板继承系统的基础,允许创建一个基础布局并在多个页面中复用。

知识点: 循环控制
题目: 在 Blade 的循环中,如何优雅地处理集合为空的情况?
A. @foreach + @if(count($items) == 0)
B. @empty
C. @forelse + @empty
D. @while + @empty

正确答案: C
原文依据:

"@forelse($users as $user)<p>{{ $user->name }}</p>@empty<p>没有用户</p>@endforelse"(出自:控制结构,第2节)

解析: @forelse 和 @empty 的组合提供了一种优雅的方式来处理集合为空的情况。这比使用 @foreach 加条件判断更简洁且可读性更强。

知识点: 组件定义
题目: 在 Blade 组件中,如何获取传入的属性?
A. {{ $attributes }}
B. {{ $props }}
C. {{ $type }}
D. {{ $inputs }}

正确答案: C

原文依据:

"<div class="alert alert-{{ $type }}">"(出自:组件和插槽,第4节)


解析: 在 Blade 组件中,传入的属性可以直接通过变量形式访问,如示例中的 $type。这些属性在组件被调用时传入,使组件更具复用性。

知识点: 条件渲染
题目: 以下哪个是 Blade 中表示”除非”条件的正确语法?
A. @except
B. @unless
C. @without
D. @exclude

正确答案: B
原文依据:“@unless(Auth::check()) 请先登录 @endunless”(出自:控制结构,第2节)
解析: @unless 指令提供了一种反向的条件判断,相当于 if(!condition)。这在某些场景下可以让代码更具可读性。

知识点: yield 与 section
题目: @yield 和 @section 的主要区别是什么?
A. @yield 只能在父模板中使用,@section 只能在子模板中使用
B. @yield 不能包含默认内容,@section 可以包含默认内容
C. @yield 用于单行内容,@section 用于多行内容
D. @yield 不能被扩展,@section 可以被扩展

正确答案: A
原文依据:“@yield(‘title’) … @section(‘sidebar’) 这是主布局的侧边栏 @show”(出自:布局和继承,第3节)
解析: @yield 主要用在父模板中定义内容占位符,而 @section 用在子模板中定义要填充到这些占位符中的内容。这是 Blade 模板继承系统的核心机制。

知识点: 包含子视图与参数传递
题目: 如何向被包含的子视图传递数据?
A. @include(‘view’, $data)
B. @include(‘view’, [‘key’ => ‘value’])
C. @include(‘view’, data: $data)
D. @include(‘view’) with($data)

正确答案: B
原文依据:“@include(‘view.name’, [‘status’ => ‘complete’])”(出自:包含子视图,第5节)
解析: 使用 @include 时可以通过第二个参数传递一个关联数组,这些数据在被包含的视图中可以作为变量使用。

知识点: 权限控制
题目: 在 Blade 模板中,如何根据用户权限条件性地显示内容?
A. @if(hasPermission())
B. @permission(‘edit’)
C. @can(‘edit’, $user)
D. @allow(‘edit’)

正确答案: C
原文依据:“@can(‘edit’, $user) 编辑 @endcan”(出自:实用示例,第6节)
解析: @can 指令用于检查用户是否具有特定权限,这与 Laravel 的授权系统完美集成,提供了声明式的权限控制。

知识点: 堆栈使用
题目: 使用 Blade 堆栈时,以下哪个步骤的顺序是正确的?
A. 先 @push,后 @stack
B. 先 @stack,后 @push
C. 顺序无关紧要
D. 必须在同一文件中使用

正确答案: B
原文依据:“{{– 在布局中定义堆栈 –}} @stack(‘scripts’) {{– 在子视图中推送内容到堆栈 –}} @push(‘scripts’)”(出自:特殊功能,第7节)
解析: 在布局文件中使用 @stack 定义存放位置,然后在其他视图中使用 @push 向该堆栈添加内容。这种机制特别适合收集分散在不同位置的脚本或样式。

知识点: 注释语法
题目: Blade 模板中的注释在浏览器源代码中是否可见?
A. 是,总是可见
B. 否,永远不可见
C. 取决于注释语法
D. 取决于配置设置

正确答案: B
原文依据:“{{– 这是 Blade 注释,不会显示在 HTML 中 –}}”(出自:基本语法,第1节)
解析: Blade 的 {{– –}} 注释语法在编译时会被完全移除,不会出现在最终的 HTML 输出中,这对于添加开发注释很有用。

知识点: 性能优化
题目: Blade 模板引擎如何优化性能?
A. 每次请求都重新编译
B. 编译后缓存为 PHP 代码
C. 使用内存缓存
D. 压缩 HTML 输出

正确答案: B
原文依据:“性能优秀(模板会被编译成原生 PHP 代码)”(出自:Blade 模板引擎的优点)
解析: Blade 模板会被编译成原生 PHP 代码并缓存,直到模板文件被修改才会重新编译,这种机制既保证了开发便利性,也确保了运行时性能。

知识点: 数据展示
题目: 在列表页面中展示数据时,如何实现分页?
A. {{ $users->paginate() }}
B. {{ $users->links() }}
C. {{ $users->pages() }}
D. {{ $users->navigate() }}

正确答案: B
原文依据:“{{ $users->links() }}”(出自:实用示例,第6节)
解析: Laravel 的分页功能通过 links() 方法在视图中渲染分页链接,这与 Blade 完美集成,可以快速实现美观的分页功能。

知识点: Blade 特性总结
题目: 以下哪项不是 Blade 模板引擎的优势?
A. 自动转义防止 XSS 攻击
B. 需要手动编译模板
C. 强大的布局和组件系统
D. 与 Laravel 框架完美集成

正确答案: B
原文依据:“性能优秀(模板会被编译成原生 PHP 代码)”(出自:特性总结)
解析: Blade 模板会自动被编译成 PHP 代码并缓存,直到模板被修改才会重新编译,这是其优势之一。不需要手动编译,这保证了开发效率和运行性能的平衡。

知识点总结

  1. 基本语法:变量输出、注释
  2. 控制结构:条件语句、循环语句
  3. 布局系统:模板继承、组件复用
  4. 组件和插槽
  5. 子视图包含
  6. 特殊功能:堆栈、服务注入
  7. 安全性考虑
  8. 性能特性

参考资料

  • Laravel Blade 模板引擎官方文档
0 0 投票数
Article Rating
订阅评论
提醒
0 评论
最多投票
最新 最旧
内联反馈
查看所有评论
0
希望看到您的想法,请您发表评论x