v-bind="object" syntax validation error

[dwightjack]

Hi!

I am currently migrating one application from vue-cli to vote using the vue-ts template.

In some components I use the <component v-bind="props" /> patterns to pass multiple props in one directive but, when I run vue-tsc --noEmit it seems that vue-tsc is not able to read the props type even if it's correctly typed in the setup method.

For example I have a template like this:

<IntervalEditBox
  v-for="interval in intervalsRef"
  :key="interval.id"
  v-bind="interval"
  @update="update"
  @delete="deleteInterval"
/>

where intervalsRef is defined in the setup method as:

export enum IntervalType {
  Work = 'work',
  ShortBreak = 'short-break',
  LongBreak = 'long-break',
  None = 'none',
}

export interface Interval {
  type: IntervalType;
  duration: number;
  remaining?: number;
  id: string;
}

const intervalsRef = ref<Interval[]>([...props.intervals]);

The error I'm receiving is:

error TS2322: Type '{ key: string; }' is not assignable to type 'Partial<{ type: IntervalType; duration: number; remaining: number; }> & Omit<Readonly<{ type: IntervalType; id: string; duration: number; remaining: number; } & {}> & VNodeProps & AllowedComponentProps & ComponentCustomProps, DefaultKeys<...>> & Omit<...> & Record<...>'.
  Property 'id' is missing in type '{ key: string; }' but required in type 'Omit<Readonly<{ type: IntervalType; id: string; duration: number; remaining: number; } & {}> & VNodeProps & AllowedComponentProps & ComponentCustomProps, DefaultKeys<...>>'.

Any hint on how could I fix this error?

[johnsoncodehk]

I will add support for v-bind="..." syntax, thanks for the report! btw this is volar issue. 😅

For now you can only break down v-bind to fix:

<IntervalEditBox
  v-for="interval in intervalsRef"
  :key="interval.id"
  :type="interval.type"
  :duration ="interval.duration"
  :remaining ="interval.remaining"
  ...
>

[dwightjack]

Thank for your reply. By the way, great project! I found a couple of type errors thanks to this! 👍

[johnsoncodehk]

Fixed in 0.0.18.

[dwightjack]

Great! Thank you! 💯