append slot on a specific q-input appears on other q-input components
-
In my application I use the append slot on q-input in combination with a q-date component as recommended in the Quasar documentation.
<q-input readonly type="text" v-model="nextDate" :label="nextDateLabel" :disable="submit" @input="$v.nextDate.$touch" bottom-slots :error="$v.nextDate.$error" error-message="Enter a valid date"> <template v-slot:append> <q-icon name="event" class="cursor-pointer"> <q-popup-proxy ref="qDateProxy" transition-show="scale" transition-hide="scale"> <q-date v-model="nextDate" :options="dateOptions" mask="M/D/YYYY" color="grey-8" @input="() => $refs.qDateProxy.hide()" /> </q-popup-proxy> </q-icon> </template> </q-input>
In the same component I also use another q-input without the append slot, but occasionally the append slot containing q-date appears on it. I have to explicitly define an empty append slot to get around this behavior.
<q-input v-model="dollarValue" type="text" :label="alertValueFloatLabel" :disable="submit" @input="$v.dollarValue.$touch" bottom-slots :error="$v.dollarValue.$error" :error-message="alertValueErrorLabel"> <template v-slot:append /> </q-input>
Is this a bug in Quasar or my approach?
-
Can you make a codepen showing what you are seeing?
Scott