[Feature Request]: Allow simple functional interface for emits #652
matthew-dean
started this conversation in
General
Replies: 1 comment
-
Note, a possible alternative would be the Vue Macros emit syntax e.g.: const emit = defineEmits<{
change: (id: number) => void
update: (value: string) => void
show: () => void
}>() The above syntax might have the advantage of having distinct keys vs a kind of intersection that functional syntax creates. (And maybe this form is even more accurate as to the shape of the component emits?) Having distinct keys might be easier to use with |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Description
Right now,
defineEmits
allows these 2 forms:IMO the 3.3 syntax, while more succint, is also somewhat counter-intuitive. These are not records which hold tuples, these are function call-backs. It also feels very weird when there are no value callbacks to have an empty array.
I propose a 3rd form, which is functional and succint:
The above syntax maps more cleanly to the
@
binding syntax as well as passing to that function the actual parameters defined e.g.<MyComponent @show="handleShow" />
IMO, this syntax is actually the most accurate in terms of modelling what these functional callbacks actually are, in terms of shape.
Further motivation
PrimeVue, a popular Vue framework, already uses emits in this pattern. They just happen to be incompatible with
defineEmits
. Now, while I wholeheartedly believe that a Vue library should not use an emit type that is incompatible with the Vue Composition API (and have filed an issue to that effect), I also believe that Vue's type syntax is the awkward one here, and it should be trivial, in terms of type definitions, to support all 3.Thanks for considering.
Beta Was this translation helpful? Give feedback.
All reactions