Blade 是 Laravel 内置模板引擎,通过 @extends、@section、@yield 实现模板继承;Component 适用于可复用、带逻辑的 UI 单元,支持属性绑定与插槽;修改后需运行 php artisan view:clear 清除缓存。

Blade 是 Laravel 自带的模板引擎,不是独立库,不需要额外安装;只要用 Laravel 就默认可用。它本质是 PHP 的编译层,所有 .blade.php 文件最终都会被缓存为原生 PHP 脚本,所以性能没问题。
如何定义和使用 Blade 布局(layout)与模板继承
Blade 继承靠 @extends + @section + @yield 三者配合。父模板用 @yield('name') 预留内容槽,子模板用 @section('name')...@endsection 填充,再通过 @extends('layouts.app') 指定继承关系。
常见错误:
- 子模板里漏写
@extends,导致页面直接输出原始 Blade 语法(如显示@section字符串) -
@yield名字和@section不一致,对应内容不渲染 - 在子模板中写了非
@section区块的 HTML 内容(比如直接写),这部分会被忽略——Blade 要求所有内容必须包裹在Hello
@section里,除非你用@parent显式插入父级内容
@extends('layouts.app')
@section('title', '用户列表')
@section('content')
用户管理
-
@foreach($users as $user)
- {{ $user->name }} @endforeach
什么时候该用 Component 而不是普通 Blade 模板
Component 更适合「带逻辑、可传参、多处复用」的 UI 单元,比如一个带状态切换的卡片、带验证提示的表单字段、或一套主题色按钮。它比 @include 更健壮:支持属性绑定、slot 插槽、生命周期方法(如 mount() 在 Livewire 中)、以及自动命名空间解析。
使用前提:
- 组件类必须放在
app/View/Components/下,类名首字母大写,如Alert - 对应视图路径是
resources/views/components/alert.blade.php - 注册方式有两种:自动发现(Laravel 8+ 默认开启)或手动在
AppServiceProvider::boot()中调用Blade::component()
调用时用 ,注意冒号表示该属性会作为变量传递(即 PHP 表达式),不加冒号就是字符串字面量。
Component 中的 slot 和 attributes 怎么配合用
Slot 是组件内部预留的“内容占位”,{{ $slot }} 输出传入的默认内容;@props(['type' => 'info']) 声明组件接收的属性,默认值可选;$attributes 是一个 MergeableAttributeBag 实例,能合并外部传入的 HTML 属性(如 class、id)并安全渲染。
典型误用:
- 在组件视图里直接 echo
$attributes(会输出对象字符串),正确写法是{{ $attributes }}或{{ $attributes->merge(['class' => 'alert']) }} - 把动态 class 拼接写成
class="alert {{ $type }}",没过滤$type可能引入 XSS —— 应该用$attributes->merge()并确保参数来自可信源或已校验 - 多个 slot 场景下忘记用命名 slot:
,对应组件内用标题 正文
{{ $header ?? '' }}
@props(['type' => 'info'])merge(['class' => "alert alert-{$type}"]) }}> {{ $slot }}
Blade 编译缓存和调试技巧
Blade 文件修改后不会实时生效,因为默认启用缓存。开发时如果改了模板但页面没变,先运行:
php artisan view:clear。生产环境务必保持缓存开启,否则每次请求都要重新编译,性能断崖下跌。
遇到报错如 Undefined variable: $users,别急着查控制器——Blade 错误堆栈常指向缓存后的 PHP 文件(路径类似 storage/framework/views/xxx.php)。这时要看原始 .blade.php 行号,并确认 compact()、with() 或 view() 第二个参数是否漏传了变量。
进阶技巧:用 @php ... @endphp 快速调试,但仅限开发;正式代码里应避免,逻辑尽量移出模板。









