Hello
I see that only @hide
and @show
events will be emited, neither @save
nor @cancel
:
<div>
{{ dueDate }}
<q-popup-edit
v-model="dueDate"
@hide="hide(dueDate)"
@show="show(dueDate)"
@save="(val, iVal) => save(val, dueDate)"
@cancel="cancel(dueDate)"
>
<q-input v-model="dueDate" dense autofocus />
</q-popup-edit>
</div>
computed: {
dueDate: {
set (dueDate) {
},
get () {
return (this.project.due_date)
? this.$d(new Date(this.project.due_date), 'short')
: ''
}
}
},
methods: {
save (val, iVal) {
console.log(val, iVal, 'save')
},
show (val) {
console.log(val, 'show')
},
hide (val) {
console.log(val, 'hide')
},
cancel (val) {
console.log(val, 'cancel')
}
}
When I open the field and change the value, in vue console are apearing the events before-show
, input
, focus
, show
, change
, before-hide
, hide
.
My template markup follows the example in the Quasar docs “https://quasar.dev/vue-components/popup-edit#Example-outside-of-QTable”
<div class="cursor-pointer">
{{ label }}
<q-popup-edit v-model="label">
<q-input v-model="label" dense autofocus counter />
</q-popup-edit>
</div>
Does anybody has an idea, what might go wrong here? Any hint is greately appreciated. Thany you
Axel