QField can't display correctly when no 'stack-label'

[zouzg7829]

What happened?

Sample:
<q-field ref="departmentSelect" style="min-width: min(160px, 46%)" dense outlined label="Standard"> <template v-slot:control> <div class="self-center full-width no-outline" tabindex="0">Field content</div> </template> </q-field>

the above QField can't display correctly.

What did you expect to happen?

QField display correctly when no 'stack-label'

Reproduction URL

https://codepen.io/zouzg7829/pen/GReaEgo?editors=1010

https://github.com/quasarframework/quasar/assets/11990739/385116ee-9f0f-4ed4-b475-742584b97280

How to reproduce?

1. Sample:
   <q-field ref="departmentSelect" style="min-width: min(160px, 46%)" dense outlined label="Standard"> <template v-slot:control> <div class="self-center full-width no-outline" tabindex="0">Field content</div> </template> </q-field>
2. the above QField can't display correctly.

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

Components (quasar)

Platforms/Browsers

Chrome

Quasar info output

No response

Relevant log output

No response

Additional context

No response

[Razvan Stoenescu]

Hi,

You need to attach a v-model (or a :model-value="...") to your QField(s) so they know when there's a value "filled in".

[zouzg7829]

Thanks!