blade组件必须用php artisan make:component创建,类需继承illuminate\view\component且render()返回view(),视图路径与类名严格匹配,属性绑定须加冒号,slot默认不转义有xss风险。

Blade组件必须用php artisan make:component创建
手动在resources/views/components/下建文件,Laravel不会自动注册类名和视图路径,调用时直接报View [components.xxx] not found。这不是路径写错的问题,而是类未被发现、视图未绑定导致的硬性失败。
- 运行
php artisan make:component Alert,生成App\View\Components\Alert类 +resources/views/components/alert.blade.php - 类名必须首字母大写、驼峰(如
DashboardCard),对应标签是小写中划线(<x-dashboard-card></x-dashboard-card>) - 类必须继承
Illuminate\View\Component,且render()方法必须返回view(),不能返回字符串或数组 - Laravel 8+ 默认开启组件自动发现,但前提是类放在
app/View/Components/,视图放在resources/views/components/,路径严格匹配
<x-xxx></x-xxx>标签里不能写PHP表达式,属性必须加冒号绑定
比如<x-button onclick="alert({{ $msg }})"></x-button>会触发未定义变量错误——因为HTML属性值不经过Blade编译,只认字面量或:xxx绑定语法。
PHP中文网提供Laravel 13.2.0版本下载,Laravel框架 是基于 PHP 8.3+ 的高性能框架,官方推荐通过 Composer 安装。它内置 AI SDK、JSON:API Resources 及原生向量搜索,支持属性驱动开发与队列路由,大幅提升开发效率。相比旧版,13.2.0 优化了缓存 TTL 管理与实时通信,无需 Redis 即可横向扩展。作为现代 Web 开发首选,它兼顾安全与极速体验,助您快速构建企业级应用。
- 正确写法:
<x-button :disabled="$isDisabled" :label="$text"></x-button>,冒号表示该属性作为PHP变量传入 - 原生HTML属性(如
id、class)可直接写字符串值,但含变量必须加冒号:<x-card class="w-full" :class="$extraClass"></x-card> - 想透传全部属性?在组件类里声明
public $attributes,并在视图中用{{ $attributes }}渲染 - 构造函数参数缺失会抛
ArgumentCountError,错误堆栈指向视图编译器,不提示“缺少 required prop”,排查成本高
@include适合轻量复用,但共享父级作用域、无法传复杂结构
当你只需要嵌入一段静态HTML或简单图表脚本,且不涉及props校验、slot嵌套、生命周期逻辑时,@include更直接、无额外开销。
- 路径用点号分隔:
@include('includes.chart')对应resources/views/includes/chart.blade.php - 它能接收父视图变量(如
$labels、$data),但无法做类型检查、默认值回退或作用域隔离 - 如果图表需响应式重绘、依赖外部JS库状态,或要统一控制加载时机,
@include比组件更灵活;但若需多个命名插槽、条件样式、权限判断,则必须用<x-chart></x-chart> - 修改
@include模板后,无需清缓存即可生效;而组件类修改后,建议运行php artisan view:clear避免旧缓存干扰
slot内容默认不转义,含用户输入时有XSS风险
<x-card>{{ $user->bio }}</x-card>会直接输出原始HTML,若$user->bio含<script></script>标签,就执行了——这不是bug,是设计如此。
- 默认插槽
{{ $slot }}等价于echo $slot,不做任何过滤 - 想安全输出?改用
{{ $slot->toHtml() }}(前提是内容已通过htmlspecialchars()或类似处理) - 命名插槽不自动渲染,必须显式调用:
<h3>{{ $title }}</h3>,且$title需在组件类中定义并赋值 - 使用
@isset($slot)判断插槽是否存在,避免空内容渲染出多余空白或布局错位










