Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Label slot is not visible when input is searchable #364

Open
rocevas opened this issue Dec 11, 2021 · 1 comment
Open

Label slot is not visible when input is searchable #364

rocevas opened this issue Dec 11, 2021 · 1 comment
Labels

Comments

@rocevas
Copy link

rocevas commented Dec 11, 2021

Describe the bug
Is not possible to change the view when item selected and input is searchable.

Expected behavior
When item selected show custom label slot. On focus switch to the search input

Screenshots
Screenshot 2021-12-11 at 10 07 09
Result:
Screenshot 2021-12-11 at 10 20 28
Expected result:
Screenshot 2021-12-11 at 10 24 56

Code:

<vue-select
    :options="getCustomers"
    v-model="form.customer_id"
    :closeOnSelect="true"
    :clearOnSelect="true"
    :clearOnClose="true"
    labelBy="name"
    value-by="id"
    placeholder="Select customer"
    @selected="selectCustomer"
>
    <template #label="{ selected }">
        <div class="flex flex-1 items-center gap-2 leading-4 px-2 py-1 text-sm">
            <div :class="'color-' + selected.color || ''" class="flex justify-center items-center w-7 h-7 text-xs font-medium rounded-lg">
                {{ selected.initial }}
            </div>
            <div>
                {{ selected.name }}
            </div>
        </div>
    </template>
    <template #dropdown-item="{ option }">
        <div class="flex items-center gap-2">
            <div :class="'color-' + option.color" class="flex justify-center items-center w-7 h-7 text-xs font-medium rounded-lg -my-0.5">
                {{ option.initial }}
            </div>
            <div>{{ option.name }}</div>
        </div>
    </template>
</vue-select>
@rocevas rocevas added the bug Something isn't working label Dec 11, 2021
@soc221b soc221b added feat and removed bug Something isn't working labels Mar 17, 2022
@MrJaysa
Copy link

MrJaysa commented Jan 28, 2023

This issue is present at the moment, whenever the searchable is set to true and custom dropdowns are implemented, it fucks it all up

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants