将 attr.class 传递到 symfony 5 中的表单主题

Passing attr.class into the form theme in symfony 5

我的表单主题:

{% block form_row %}
<div class="form_row {% if errors|length > 0 %} is_error {% endif %} {{ attr.class }}" {% if attr|length > 0 %} {% for key, value in attr %} {{key}}="{{value}}" {% endfor %} {% endif %}>
    {% if block_prefixes.1 != "checkbox" %}
        {{ form_label(form)|raw }}
    {% endif %}
    {% if icon != null and block_prefixes.1 != "checkbox" %}
        <div class="input__icon-container {% if block_prefixes.2 == "password" %}input__password-container{% endif %}">
            <div class="icon">
                {{ source('@public_path' ~ asset('build/images/icons/' ~ icon|replace({"icon-":""}) ~ '.svg')) }}
            </div>
            {% if block_prefixes.2 == "password" %}
                <span class="password-reveal">Show</span>
            {% endif %}
            {{ form_widget(form, { 'attr': {'class': 'form-control'} }) }}
        </div>
        {{ form_errors(form) }}
    {% else %}
        {% if block_prefixes.2 == "password" %}
            <div class="input__password-container">
                <span class="password-reveal">Show</span>
        {% endif %}

        {{ form_widget(form, { 'attr': {'class': 'form-control'} }) }}

        {% if block_prefixes.2 == "password" %}
            </div>
        {% endif %}
        {{ form_errors(form) }}
    {% endif %}
</div>
{% endblock %}

{% block radio_widget %}
    <div class="label">{{ label|raw }} {% if help != null %} <span class="help">{{help}}</span> {% endif %}</div>
    {% for choice in choices %}
        <div class='input__choice-container'>
            <label class="is_regular"> <input type="radio" name="{{ full_name}}" {% if required == "true" %} required="required" {% endif %} value="{{ choice.value }}"><span class="radio"></span> <span>{{ choice.label }}</span> </label>
        </div>
    {% endfor %}
{% endblock %}

{% block checkbox_widget %}
    <div class="custom-checkbox custom-control">
        <input type="checkbox" class="custom-control-input" id="{{id}}" name="{{ full_name}}">
        <label class="custom-control-label" for="{{id}}">{{label|raw}}</label>
    </div>
{% endblock %}

我得到的错误: Key "class" does not exist as the array is empty.

但这并不准确,因为这是我针对此表单行的表单输出:

{{ form_row(registrationForm.displayname, {
    attr : { "class" : "mb-1", "data-test" : "tests"}
})}}

那么问题来了,如何以合适的方式输出class的内容呢?很明显我做错了。

这是因为你的模板没有按字面意思打印class

在这里了解表单的结构 Form Customization

您将需要像找到的内置模板之一一样注入属性打印逻辑(bootstrap 4 个示例) in Form Themes

{% block form_row -%}
    {%- set widget_attr = {} -%}
    {%- if help is not empty -%}
        {%- set widget_attr = {attr: {'aria-describedby': id ~"_help"}} -%}
    {%- endif -%}
    <div{% with {attr: row_attr|merge({class: (row_attr.class|default('') ~ ' form-group' ~ ((not compound or force_error|default(false)) and not valid ? ' has-error'))|trim})} %}
         {{ block('attributes') }}
    {% endwith %}>
        {{- form_label(form) }} {# -#}
        {{ form_widget(form, widget_attr) }} {# -#}
        {{- form_help(form) -}}
        {{ form_errors(form) }} {# -#}
    </div> {# -#}
{%- endblock form_row %}

如果您不想重复,请扩展具有打印逻辑的内置表单小部件。 或者简单地在你的块上打印这些传递的属性。