信息发布→ 登录 注册 退出

Laravel怎么使用Blade模板引擎_Laravel模板继承与Component组件复用【手册】

发布时间:2025-12-30

点击量:
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 内容(比如直接写

    Hello

    ),这部分会被忽略——Blade 要求所有内容必须包裹在 @section 里,除非你用 @parent 显式插入父级内容
@extends('layouts.app')

@section('title', '用户列表')

@section('content')
    

用户管理

    @foreach($users as $user)
  • {{ $user->name }}
  • @endforeach
@endsection

什么时候该用 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 属性(如 classid)并安全渲染。

典型误用:

  • 在组件视图里直接 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 快速调试,但仅限开发;正式代码里应避免,逻辑尽量移出模板。

标签:# undefined  # 不需要  # 多个  # 都要  # 放在  # 进阶  # 是一个  # 复用  # 绑定  # 行号  # 插槽  # ui  # alert  # 对象  # php  # class  #   # 继承  # 字符串  # Error  # include  # 命名空间  # echo  # xss  #   # app  # html  # laravel  
在线客服
服务热线

服务热线

4008888355

微信咨询
二维码
返回顶部
×二维码

截屏,微信识别二维码

打开微信

微信号已复制,请打开微信添加咨询详情!