I’m following the Vue 3 migration guide and trying to declare all the $emit events in the emits array. My component is written in TypeScript, and I’m still using Vue.extend. However, I’m encountering a type error when adding the emits property.
original code:
import Vue from 'vue';
export default Vue.extend({
props: {
message: String,
},
methods: {
sendMessage() {
this.$emit('message-sent');
},
},
template: `
<div @click="sendMessage">
{{ message }}
</div>
`,
});
</script>
what im trying to write:
import Vue from 'vue';
export default Vue.extend({
name: 'MessageComponent',
emits: ['message-sent'],
...
However, I’m getting the following type error:
Vue: No overload matches this call.
The last overload gave the following error.
emits: any
It seems like the emits property is not recognized by Vue.extend. How can I correctly declare the emits array in my component while still using Vue.extend to resolve this type error?
Eli Perlshtein is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.