如何为Shopware 6前端自定义CMS元素添加称谓下拉框？

你开发的自定义CMS表单中，称谓字段无法显示选项，核心原因是内置的称谓选择组件缺少动态数据传入。以下是具体修复步骤：

步骤1：在主模板中获取称谓数据 #

Shopware的称谓（Salutation）数据存储在系统中，需要通过服务获取后传递给组件。在你的模板开头（{% block element_form %}下方）添加获取数据的代码：

{% block element_form %}
    {% set config = element.fieldConfig.elements %}
    {# 获取系统中的称谓列表 #}
    {% set salutations = services.salutation.repository.search(criteria(), context).items %}
    
    <div class="cms-element-contact">
        <!-- 原有代码不变 -->

步骤2：将数据传递给称谓选择组件 #

修改原有的cms_packageform_select_salutation块，在sw_include时传入salutations变量：

{% block cms_packageform_select_salutation %}
{% sw_include '@Storefront/storefront/element/cms-element-form/form-components/cms-element-form-select-salutation.html.twig'
        with {
        additionalClass: 'col-md-6',
        required: true,
        salutations: salutations  <!-- 新增：传递称谓数据 -->
    }
    %}
{% endblock %}

备选方案：直接在模板中渲染称谓选项（如果组件不兼容） #

如果内置组件无法正常接收数据，你可以直接替换该块的内容，手动渲染select和选项：

{% block cms_packageform_select_salutation %}
<div class="col-md-6">
    <label class="form-label" for="salutation">
        {{ 'form.label.salutation'|trans }}
        {% if required %}<span class="required">*</span>{% endif %}
    </label>
    <select name="salutationId" id="salutation" class="form-select" {% if required %}required{% endif %}>
        {% for salutation in salutations %}
            <option value="{{ salutation.id }}">{{ salutation.displayName }}</option>
        {% endfor %}
    </select>
    {% if formViolations.salutationId %}
        {% sw_include '@Storefront/storefront/utilities/form-violation.html.twig' with {
            violation: formViolations.salutationId
        } %}
    {% endif %}
</div>
{% endblock %}

验证修复效果 #

1. 清除Shopware缓存（后台设置->系统->缓存管理）
2. 刷新前台页面，称谓字段应该会显示系统中配置的所有称谓选项（比如先生、女士等）

内容的提问来源于stack exchange，提问作者Radhu