Skip to content

When using verbose syntax of v-model, if the argument is generic, parent will show it as any, reporting error #8623

@rodrigocfd

Description

@rodrigocfd

Vue version

3.3.4

Link to minimal reproduction

https://github.com/rodrigocfd/vue-bug-generic

Steps to reproduce

When using the verbose syntax of component v-model, when the argument is a generic parameter, the parent component won't type the argument, which will appear as any. Reproducible example below.

  • Child component:
<script setup lang="ts" generic="T">
const props = defineProps<{
	modelValue: T;
}>();

const emit = defineEmits<{
	'update:modelValue': [value: T];
}>();
</script>

<template>
	Hi
</template>
  • Parent component:
<script setup lang="ts">
import {ref} from 'vue';
import Child from './Child.vue';

const name = ref('Evan');
</script>

<template>
	<Child :modelValue="name"
		@update:modelValue="v => name = v" />
</template>

What is expected?

The argument properly typed, not any, thus no error reporting.

What is actually happening?

The following error message:

> bug-repro@1.0.0 ok
> vue-tsc --noEmit

src/Parent.vue:10:23 - error TS7006: Parameter 'v' implicitly has an 'any' type.

10   @update:modelValue="v => name = v" />
                         ~


Found 1 error in src/Parent.vue:10

Also, Volar in VSCode reports the same error:

repro

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (12) x64 Intel(R) Core(TM) i7-8700 CPU @ 3.20GHz
    Memory: 13.36 GB / 31.95 GB
  Binaries:
    Node: 18.14.1 - C:\Program Files\Nodejs\node.EXE
    npm: 9.7.1 - C:\Program Files\Nodejs\npm.CMD
  Browsers:
    Chrome: 114.0.5735.134
    Edge: Spartan (44.19041.1266.0)
    Internet Explorer: 11.0.19041.1566
  npmPackages:
    vue: ^3.3.4 => 3.3.4

Any additional comments?

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions