Estoy tratando de usar la oferta bidireccional de Vue3 con v-model , pero mi emit() no actualiza el valor principal. ¿Podría decirme dónde me equivoco? ¡Gracias!

El padre se parece a:

 <template> <div class="card"> <LearnersTable v-model:toActivate="toActivate" /> <!-- To control if this is being updated --> {{ toActivate.length }} </div> </template> <script setup> [...] // List of person to activate const toActivate = []; </script>

Y Niños (LearnersTable) se parece a:

 <template> [...] <tr v-for="row in rows" :key="row.id" > <span> <Toggle v-model="row.enabled" @change="onChangeActivate(row)"/> </span> </tr> [...] </template> <script setup> const props = defineProps({ toActivate: { type: Array, default: () => [], }, }); const emit = defineEmits(['update:toActivate']); const { toActivate, } = toRefs(props); function onChangeActivate(row) { if (row.enabled === true) { toActivate.value.push(row); } emit('update:toActivate', toActivate.value); } </script>

Estoy omitiendo un poco de código aquí. Pero el problema es que mi emisión no funciona, no obtengo el valor toActivate actualizado en el padre.

Gracias !