symfony ux live components 实现零 js 交互，将逻辑写在 php 控制器中，通过 turbo 传输变化、stimulus 桥接，无需手写 js；需安装 ux-live-component、ux-turbo 和 stimulus-bundle，并配置 webpack encore。
直接用 Symfony UX 的 Live Components 就能零 JS 实现交互特效——它把交互逻辑写在 PHP 控制器里，自动同步到前端，连 <script></script> 标签都不用加。
Live Component 是真正的“零 JS”方案
它不是封装 JS 库，而是让 PHP 类直接控制 DOM 行为：点击按钮、切换状态、加载数据、验证表单……全在 PHP 层完成。Turbo 负责传输变化，Stimulus 仅做底层桥接（你完全不用写一行 JS）。
必须装对核心包
-
symfony/ux-live-component（主组件） -
symfony/ux-turbo（驱动无刷新更新） -
symfony/stimulus-bundle（自动注册控制器，不需手动写 JS 文件）
执行：
composer require symfony/ux-live-component symfony/ux-turbo symfony/stimulus-bundle npm install && npm run build
三步写出一个带状态切换的按钮
- 创建 PHP 类，继承
AbstractController并实现LiveComponentInterface - 加
#[LiveComponent]属性，声明public bool $isActive = false; - 在 Twig 中用
{{ live_component('toggle_button') }}渲染，内部自动绑定<button></button>的 click 事件
点击后 $isActive 翻转，模板重渲染，Turbo 自动替换 DOM —— 没有 JS，没有事件监听器，没有 fetch 调用。
表单交互也一样简单
Live Component 支持 #[LiveProp] 注解标记可响应属性，#[LiveArg] 接收表单字段，#[LiveAction] 方法处理提交：
- 表单提交走 Turbo POST，返回 HTML 片段
- 错误时自动回填字段、显示验证消息（复用 Symfony Validator）
- 成功后可重定向或局部更新，全由 PHP 控制流决定
注意两个硬性前提
- Webpack Encore 必须启用 Stimulus 桥接（
enableStimulusBridge('./assets/controllers.json')） -
controllers.json至少包含一条记录（哪怕空的），否则live_component()函数会报错
别混淆 Twig Component 和 Live Component
-
ux-twig-component只是模板复用（静态），无交互能力 -
ux-live-component才是带状态、响应事件、可修改属性的真正交互组件
本质上，它把前端交互降级为服务端状态机 + Turbo 增量更新——你写的还是 PHP，只是用户感觉像 SPA。
php免费学习视频：立即使用
踏上前端学习之旅，开启通往精通之路！从前端基础到项目实战，循序渐进，一步一个脚印，迈向巅峰！
