Select placeholder with no use-input?

[rubs]

Did anyone have success creating a placeholder for a Select component with no use-input property?

I want it do simply display e.g. “Choose an option” when nothing is selected in a read-only (i.e. non-editable) Select, and for several reasons I also cannot use the component label for this.

Thanks in advance for any tips.

[beets]

You can use the selected slot for this:

     <q-select
        filled
        v-model="model"
        :options="options"
        stack-label
        label="Standard"
      >
        <template v-slot:selected>
           <template v-if="model">
             {{ model.label }}
          </template>
          <template v-else>
             Choose an option
          </template>
        </template>
      </q-select>

[rubs]

Great, thanks for the solution! Select is one of the most complex Quasar components, so it’s an easy miss. It deserves at least an example in the docs IMO. Thanks again.

[beets]

@rubs It’s actually in the docs, but as a more complicated example. I just simplified it a bit to make it more clear. https://quasar.dev/vue-components/select#Example--Selected-item-slot

[rubs]

Good! I really meant in the API section / selected slot, but improvements to the docs are always welcome. Now I see that I also completely missed the selected-item slot… This is a truly flexible component, I’m always learning something new about it. Thanks again!