opened
thenickname
username_0
Hello,

I have an issue when trying to create a vue component **using a generic factory function**. The problem is that the generic type never gets "resolved" to an actual type. It always stays **T** instead of becoming something useful like **SomeType**.

To be honest I am not sure if this is a limitation in vue, vue-tsx-support or TypeScript itself. Maybe someone could help clarify the issue or see if this is an actual error?

Here is what I am trying to do:
```tsx
// define a generic component factory function
function myComponentFactory<T>() {

  return component( {

    name: 'MyComponent',

    render() {
      return (
        <ul>
        { this.options.map( ( el, i ) =>
            <li key={i}>
              <span>{el[ this.label ]}</span>
            </li>,
        ) }
        </ul>
      );
    },

    props: {

      // use the generic type as prop type for 'options' array
      options: type( Array as () => T[] )
        .required,

      // use generic keyof T type for label
      label: type( String as () => string as () => keyof T )
        .required,

    },

  } );

}
```

Now my hope was that by calling the factory function with a specific type the prop types would assume this given type as well. Unfortunately this does not work:
```tsx
// Define type for factory function
interface Option {
  readonly foo: string;
  readonly bar: number;
}

// call generic factory function and specify the type
const MyComponent = myComponentFactory<Option>();

component( {

  name: 'Container',

  render() {
    return (
      <MyComponent
        // 'options' now should be typed as Option[]
        // but it is still typed as T[]
        // TypeScript throws error because 'Option' is not assignable to 'T'
        options={this.myCompOptions}

        // 'label' should be typed foo | bar
        // but it is still typed as keyof T
        // again, Typescript error
        label={'foo'} />
    );
  },

  computed: {

    myCompOptions(): Option[] {
      return [
        {
          foo: 'baz1',
          bar: 1,
        },
        {
          foo: 'baz2',
          bar: 2,
        },
        {
          foo: 'baz3',
          bar: 3,
        },
      ];
    },

  },

} );
```

Are generic prop types even possible? Any idea how this could be handled?
Generic prop types are not working (Type 'SomeType' is not assignable to type 'T')
issue
created
wonderful-panda
username_1
Write return type explicitly.

```typescript
import { TsxComponent } from "vue-tsx-support";

function myComponentFactory<T>(): TsxComponent<Vue, { options: T[], label: keyof T }> {
   /* snip */
}
```
comment
created
thenickname
username_0
Hey thanks! But this means you have to provide the prop types twice? I mean in two different places?
comment
created
wonderful-panda
username_1
I don't know.
comment
created
thenickname
username_0
ok. Still thanks a lot for your help! Closing the issue
comment
closed
thenickname
username_0
issue