Closed
Description
Use case:
Having a wrapper component, I want the parent to be able to populate the slots of the wrapped component.
Implementation:
<template>
<v-alert
v-bind="props"
variant="outlined">
<template v-for="(_, slot) in slots" #[slot]="scope">
<slot :name="slot" v-bind="scope || {}" />
</template>
</v-alert>
</template>
<script setup lang="ts">
import type { VAlert } from 'vuetify/components/VAlert';
import type { Props } from './types/CustomAlert.model';
const props = defineProps<Props>();
const slots = defineSlots<VAlert['$slots']>();
</script>Current behavior:
The use case is still possible to run with the same code prior to v2 of vue-tsc, but running the vue-tsc command return the following error:
error TS2345: Argument of type '{ props?: Record<string, any> | undefined; }' is not assignable to parameter of type '{ props: Record<string, any>; }'.
Types of property 'props' are incompatible.
Type 'Record<string, any> | undefined' is not assignable to type 'Record<string, any>'.
Type 'undefined' is not assignable to type 'Record<string, any>'.
Expected behavior:
Running vue-tsc should not throw an error.