为何两个Symfony项目中表单类型渲染效果存在差异?
表单渲染差异问题排查
项目概况
- 两个近乎完全一致的小型项目,分别为
webpack和retro - webpack版本:通过
@import "~bootstrap/scss/bootstrap";在../app.scss文件中引入Bootstrap 5.2.1样式 - retro版本:通过
<link rel="stylesheet" href="{{ asset("css/bootstrap.min.css") }}"/>引入同版本Bootstrap CSS - 两个项目的
../src源码目录与../template模板目录内容完全一致
核心问题
所有表单字段的渲染效果存在显著差异(以单选框字段meal_type为例),目前仅发现Symfony分析器中的时间线存在不同,无法定位差异原因。
模板代码片段
<div class="col-6"> {{ form_row(form.meal_type) }} </div>
渲染结果对比
retro项目
渲染效果

生成的HTML代码
<div> <div id="meal_meal_type"> <input type="radio" id="meal_meal_type_0" name="meal[meal_type]" required="required" value="Breakfast" checked="checked" /> <label for="meal_meal_type_0" class="required">Breakfast</label> <input type="radio" id="meal_meal_type_1" name="meal[meal_type]" required="required" value="Lunch" /> <label for="meal_meal_type_1" class="required">Lunch</label> <input type="radio" id="meal_meal_type_2" name="meal[meal_type]" required="required" value="Dinner" /> <label for="meal_meal_type_2" class="required">Dinner</label> </div> </div>
webpack项目
渲染效果

生成的HTML代码
<fieldset class="mb-3"> <div id="meal_meal_type"> <div class="form-check"> <input type="radio" id="meal_meal_type_0" name="meal[meal_type]" required="required" class="form-check-input" value="Breakfast" checked="checked" /> <label class="form-check-label required" for="meal_meal_type_0">Breakfast</label> </div> <div class="form-check"> <input type="radio" id="meal_meal_type_1" name="meal[meal_type]" required="required" class="form-check-input" value="Lunch" /> <label class="form-check-label required" for="meal_meal_type_1">Lunch</label> </div> <div class="form-check"> <input type="radio" id="meal_meal_type_2" name="meal[meal_type]" required="required" class="form-check-input" value="Dinner" /> <label class="form-check-label required" for="meal_meal_type_2">Dinner</label> </div> </div> </fieldset>
Symfony分析器时间线差异
retro项目时间线

webpack项目时间线

内容的提问来源于stack exchange,提问作者geoB
相关产品推荐
相关产品推荐

