Allow to pass defined event to parent
What problem does this feature solve?
Imagine wrapper component like this (I have some of them)
<script setup>
import { ref } from 'vue'
import createHash from 'hash-generator'
const emit = defineEmits(['update:modelValue'])
const generated = ref(false)
function generatePassword() {
generated.value = true
emit('update:modelValue', createHash(10))
}
</script>
<template>
<!-- Need to change click:prepend-inner to click:append-inner after vuetify bug fix -->
<v-text-field
v-bind="$attrs"
append-inner-icon="mdi-dice-multiple-outline"
:type="generated ? 'text' : 'password'"
@input="generated = false"
@click:prepend-inner="generatePassword"
@update:modelValue="emit('update:modelValue', $event)"
/>
</template>
Every time I need to define @update:modelValue="emit('update:modelValue', $event)"
on such components what I think is stupid.
Because defined events does not pass to parent. If do not define it You got warning (warning is bad) etc. but work like a charm.
What does the proposed API look like?
Maybe something like passthrough: true
(need better name) in event definition.
Like
const emit = defineEmits({'update:modelValue': { passthrough: true }})