Dynamic events type problem.

[szulcus]

I have a fairly complicated component where I need to have emits defined dynamically. I define the name of event using the actions property. In Vue 2 (Options API) I had no problem with it, while in Vue 3 (Composition API) I got the following error:

Type '(deletedRow: RowItem) => void' is not assignable to type 'FillingEventArg<(({ "change-sorting": (column: string) => void; } & { [x: string]: (item: { [key: string]: any; }) => void; })[Uncapitalize<Capitalize<string>>] extends null ? (...args: any[]) => any : (...args: ({ ...; } & { ...; })[Uncapitalize<Capitalize<string>>] extends (...args: infer P) => any ? P : never) =>...'.ts(2322)
__VLS_types.ts(108, 56): The expected type comes from property 'delete-row' which is declared here on type 'EventObject<{ $: ComponentInternalInstance; $data: {}; $props: Partial<{ filters: { [key: string]: string[]; }; actions: { icon: string; emit: string; }[]; editable: boolean; }> & Omit<...>; ... 10 more ...; $watch(source: string | Function, cb: Function, options?: WatchOptions<...> | undefined): WatchStopHandle; } ...'

Emits type:

interface Emits {
	(name: 'change-sorting', column: string): void;
	(name: string, item: { [key: string]: any }): void;
}

Actions rendering:

<div
	v-for="action in props.actions"
	:key="action.emit"
	class="action__item"
	@click="emit(action.emit, item)"
>
	<SvgIcon :name="action.icon" class="item__icon" />
</div>

Are you able to fix it somehow?

[johnsoncodehk]

Not sure yet, but little bit like #1855

[szulcus]

@johnsoncodehk It works fine for me and I don't really understand why it wouldn't work 🤔

interface Emits {
	(e: 'event-any', arg: any): void;
	(e: 'event-str', arg: string): void;
}

I am even able to perform:

interface Emits {
	(e: '__', arg: any): void;
}

And use as @__="...".

I found this 2020 thread (vuejs/rfcs#204) that would solve my problem, but as far as I can see, they haven't implemented it yet. I have used this workaround temporarily.

interface Emits {
	(name: string, item: any): void;
}

Hope to be able to improve it someday.