Generic props

[tcastelly]

Hello,

I'm trying to write a component with generic props like this:

import { defineComponent, PropType } from 'vue';

export default function <T extends string | number>() {
  return defineComponent({
    name: 'GInput',
    props: {
      value: [Number, String] as unknown as PropType<T>,
    },
    setup: (p) => () => <input value={p.value} />,
  });
}

I've this error:

Property 'value' does not exist on type 'LooseRequired<Readonly<ExtractPropTypes<{ value: PropType; }>> & Readonly<{}> & {}>'.

It seems that the PropType can't work with generic.

[KazariEX]

You should define generic components like this:

import { defineComponent } from 'vue';

export default defineComponent(
  <T extends string | number>(p: {
    value?: T,
  }) => () => <input value={p.value} />,
  {
    name: 'GInput',
    props: {
      value: [Number, String],
    },
  },
);

https://vuejs.org/api/general.html#function-signature