Description
Vue - Official extension or vue-tsc version
2.1.10
VSCode version
1.94.2
Vue version
3.5.12
TypeScript version
5.6.3
System Info
No response
package.json dependencies
No response
Steps to reproduce
The bugs are described in the comments of the code.
App.vue
<script setup lang="ts">
import { h, ref } from 'vue';
import Comp from './Comp.vue';
const foo = ref<string>('foo');
/* BUG 1 - moved to: https://github.com/vuejs/core/issues/12307 */
// val should be of type 'string', not 'unknown'
const FunctionalComponent = () => h(Comp, {
/* unknown */ modelValue: foo.value,
['onUpdate:modelValue']: (val /* unknown */) => foo.value = val,
});
</script>
<template>
<!-- BUG 2 -->
<Comp/> <!-- this errors as expected, cause modelValue prop is not provided -->
<Comp :whatever="''" /> <!-- this does not error, somehow passing *any* prop makes the model value not required? -->
</template>
Comp.vue
<script setup lang="ts" generic="T">
defineModel<T>({required: true});
</script>
<template />
What is expected?
Bug 1: Render functions should have proper type based on the provided value to the generic component.
Moved to: vuejs/core#12307
Bug 2: Passing any/non-existing prop to a generic component should not make the component's model value "not required".
What is actually happening?
Bug 1: Render functions have 'unknown' type, regardless of the provided value to the generic component.
Moved to: vuejs/core#12307
Bug 2: Passing any/non-existing prop to a generic component makes the component's model value "not required".
Link to minimal reproduction
https://github.com/DrWarpMan/vue-generic-bug