New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Export Prop type in main types file (vue/types/index.d.ts) #6850

Open
ferdaber opened this Issue Oct 19, 2017 · 4 comments

Comments

Projects
None yet
5 participants
@ferdaber

ferdaber commented Oct 19, 2017

What problem does this feature solve?

When attempting to declare a type for a complex object-type prop for a component, it's difficult to understand (without knowing exactly how the Props typing works) how to cast that specific prop to the interface you create.

The best way of doing it currently is to do this:

import Vue from 'vue'
import { Prop } from 'vue/types/options'

interface FooBar {
  foo: string,
  bar: string
}

export default Vue.extend({
  props: {
    foobar: Object as (() => FooBar)
  }
})

What does the proposed API look like?

It would be nice to expose the Prop generic type in vue/types/options.d.ts in the default types export so that we can simply use this:

import Vue, { Prop } from 'vue'

// boilerplate
  props: {
    foobar: Object as Props<FooBar>
}

This also extends to complex callback types if need be so that whenever the regular prop types via the primitive type constructors don't work, we can create an interface and cast it as Prop<ICustomType> and it just works.

@sandangel

This comment has been minimized.

sandangel commented Oct 19, 2017

Did you tried vue-property-decorator?

import Vue from 'vue'
import { Prop, Component } from 'vue-property-decorator'

interface FooBar {
  foo: string,
  bar: string
}

@Component
export default class App extends Vue {
  @Prop() foobar: FooBar;
}
@ktsn

This comment has been minimized.

Member

ktsn commented Oct 19, 2017

I like the idea. Prop type would hide the internal detail of type declaration and looks more intuitive syntax.

@sandangel This proposal is not related with decorators. It would help us declare props type easier with canonical API.

@ferdaber

This comment has been minimized.

ferdaber commented Oct 19, 2017

I can do a PR if it's easier since this would be a very simple change.

@yyx990803

This comment has been minimized.

Member

yyx990803 commented Oct 19, 2017

@ferdaber yes please.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment