CODEWITHSUNDEEP
shopware
Marcel
Marcel

Reputation: 438

Shopware 6 sw-entity-single-select empty options

I am using the <sw-entity-single-select tag, but the items inside are empty. The amount of items are correct, and the console.log data on change also gives correct data. Maybe i'm missing an attribute or something?

This is the tag

<sw-entity-single-select
    v-model="component.dimensionType"
    entity="dimension"
    :localMode="component.isNew()"
    label="Koppel dimensie aan component"
    @change="setDimension"
>
</sw-entity-single-select>

And this is the entity definition of dimension

return new FieldCollection(
            [
                (new IdField('id', 'id'))->addFlags(new Required(), new PrimaryKey()),
                (new StringField('title', 'title'))->addFlags(new Required()),
                (new OneToManyAssociationField(
                    'components',
                    ComponentDefinition::class,
                    'dimension_type',
                    'id'))->addFlags(new RestrictDelete(), new ReverseInherited('dimensionType')
                ),
            ]
        );

And the relation the other way around in component

new FkField('dimension_type', 'dimensionType', DimensionDefinition::class),
                new ManyToOneAssociationField(
                    'dimension',
                    'dimension_type',
                    DimensionDefinition::class
                ),

Upvotes: 1

Views: 2185

Answers (2)

Christopher Dosin
Christopher Dosin

Reputation: 1361

If you have a custom entity Vue doesn't know which property to take as a name. Therefore you have to pass your custom name within the provided slot of the sw-entity-single-select component.

An Example:

<sw-entity-single-select
    v-model="component.dimensionType"
    entity="dimension"
    :localMode="component.isNew()"
    label="Koppel dimensie aan component"
    @change="setDimension">

    <template #result-item="{ item, index }">
        <slot name="result-item" v-bind="{ item, index }">
            <li is="sw-select-result" v-bind="{ item, index }">
                {{ item.title }}
            </li>
        </slot>
    </template>
</sw-entity-single-select>

Upvotes: 2

Valerio8787
Valerio8787

Reputation: 905

I think you missed labelProperty attribute which specifies the text of each item.

Upvotes: 2

Related Questions