Open
Description
Vue version
3.5.14
Link to minimal reproduction
Context
Firstly thanks to the community and the maintainers, I really like vue.
I was replacing my type-unsafe $attrs.myEvent
with typesafe events defined with defineEmits
.
Steps to reproduce
<!-- parent -->
<script setup>
import Comp from './Comp.vue';
function printToConsole(...args) {
console.log('waso', ...args);
}
</script>
<template>
<Comp @myEmit="printToConsole" />
</template>
<-- Comp.vue -->
<script setup lang="ts">
defineEmits<{
(event: 'myEmit', stuff?: string): void;
}>();
</script>
<template>
<!-- 1. this works if you comment out `defineEmits` -->
<!-- <input type="button" value="my button" @click="$attrs.onMyEmit" /> - {{ typeof $attrs.onMyEmit }} -->
<!-- 2. this sort of looks like it should work based on the typing of `onMyEmit` but doesn't -->
<input type="button" value="my button" @click="onMyEmit" /> - {{ typeof onMyEmit }}
<!-- 3. this works but is clunkier -->
<!-- <input type="button" value="my button" @click="(...args) => $emit('myEmit', 'hi')" /> -->
</template>
In Comp.vue
above, the resolved types really make it look like I could access onMyEmit
as a function
What is expected?
One of two:
- Either the type
onMyEmit
isn't reported in the template - or
onMyEmit
is indeed defined.
What is actually happening?
At runtime onMyEmit
doesn't exist.
System Info
https://play.vuejs.org/#eNqlVE1v2zAM/SucUcApkDjo0l2yNOtW5LAB+8DWo4HFtWlHjSwZEuUkCPLfR8nLR4O1h/WUiCL53uOjvI0+Nk3SOozG0cTmRjQEFsk101SJutGG4E7XDZRG1xAnQ3/w6fH7VKWqdConoRU0Rii613daWS2xlyRJZip7CdtUAeRdNJG66sWrzOq4D/sMbrNL1WTYQTMoHwjrRmaEfAKYBPjbejOrBd2k0VOkNIIhp02GJzVRPyLLmKWokkerFSsLNNIo51ZCovneeNI2jcYdQX+XSalXX0KMjMP+Pp4vMF/+I/5o1z6WRj8MWjQtUzncEUtD6q5nv77hmv8fLmtdOE/8hcufyNqc59ilfXKqYNoneYHt5+CPUNW9na0Jld2L8kR95i7kpxH75af4nPQj3VFyHerYFJ7i3uvz1QCZqYqtIG7D8y6wFAq9PXYSevawRUVjiDvT2G1Lriw/jPmX3asux9BqUXjrpz2/AS/Z/2YwgKsEaCEsrLRZWhAlbLTjraprhgHtCOYnHOYwGBxLJ0I1nECbBpnxgyPyQ4U2k84H6g0cYre5FPmSgxcZkbGJVl8D/7BjMIDtNrTRJZwlwG7XYR5Q3/4lbP374QKpNROXYonA6XahnSyCGnjILBbAL4gW6NvzeHzBfN977vlBodGqmA7K/kPU82pOZJxIGD2ZuSfBh1w6tRRoXj3i4xfiZgoXyOi947bECxFfdjw7oPPn/btF45edF3OUvEuurqPdH1bklnw=
TS: 5.8.3, I am not sure what version of vue-tsc the vue playground is using.
Any additional comments?
No response