[Vuejs]-I want to disable the animation of a q-select (quasar select input)

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โ€™:โ€"

Leave a comment