q-input @input not working
-
Hi, I am using q-input with v-model two ways data binding this way:
Parent:
<modal-task-name v-model:name="taskToSubmit.name"/>
Child:
<template> <div class="row q-mb-sm"> <q-input :rules="[val => !!val || 'Field is required']" outlined label="Task name" class="col" autofocus clearable :value="name" @input="(event) => $emit ('update:name', event.target.value)" /> </div> </template> <script> export default { props: ['name'] } </script>
Changes in the prop “name” are not passed to the parent. However, if I change the q-input with a input component it works fine. Any idea why?
-
By the way using:
Pkg quasar… v2.0.0-beta.9
Pkg @quasar/app… v3.0.0-beta.9 -
This post is deleted! -
Thanks. When I use :name.sync with quasar V2 (vue 3) it says deprecated… That’s why I was using the V3 way. Johnny#5034 on discord chat helped me out
https://discord.com/channels/415874313728688138/806171748046733332/818570585801752676
Parent:<modal-task-name v-model:name="taskToSubmit.name"/>
Child:
<q-input :rules="[val => !!val || 'Field is required']" :modelValue="name" @update:modelValue="event => $emit('update:name', event)" outlined label="Task name" class="col" autofocus clearable />