0๐
โ
Use the "selected" slot and show it only when nothing is selected:
<q-select v-model="model" :options="options">
<template v-if="model === null" v-slot:selected>
<div class="text-grey-6">Placeholder</div>
</template>
</q-select>
Of course you could customize your placeholder to match the default labels even more closely.
0๐
<q-select
emit-value
map-options
:placeholder="companyInformationPage.formFields.registrationCountryId === null?'Placeholder':''"
filled
v-model="companyInformationPage.formFields.registrationCountryId"
:options="companyInformationPage.references.countryOfRegistrationOptions"
style="width: 100%"
use-input
:rules="companyInformationPage.formValidations.registrationCountryId.rules"
@filter="filterCountry">
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey"> No results</q-item-section>
</q-item>
</template>
</q-select>
// for use-input โ> :placeholder="companyInformationPage.formFields.registrationCountryId === null?โPlaceholderโ:โ"
Source:stackexchange.com