Skip to content
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

TypeScript: can't infer prop names and types when contains any type prop #6841

Closed
wonderful-panda opened this issue Oct 18, 2017 · 4 comments

Comments

@wonderful-panda
Copy link

Version

2.5.2

Reproduction link

https://github.com/wonderful-panda/vue-sandbox

Steps to reproduce

Compile this code by tsc

import Vue, { VNode } from "vue";

const NgComponent = Vue.extend({
    name: "NgComponent",
    props: {
        foo: { type: String },
        bar: {}    // any types are accepted
    },
    render(h): VNode {
        return h("div", this.foo);
    }
});

or clone from repro link and npm install && npm run build

What is expected?

Successfully compiled.

And this.foo is treated as string, this.bar is treated as any.

What is actually happening?

Failed to compile.

src/index.ts(10,30): error TS2339: Property 'foo' does not exist on type 'CombinedVueInstance<Vue, {}, {}, {}, Readonly<{}>>'.

Workaround:

import Vue, { VNode } from "vue";

Vue.extend({
    name: "Workaround",
    props: {
        foo: { type: String },
        bar: {} as (() => any)   // any types are accepted
    },
    render(h): VNode {
        return h("div", this.foo);
    }
});
@ktsn
Copy link
Member

ktsn commented Oct 19, 2017

Indeed it does not work if it has any typed props definition. I'm not sure about the reason, though.

@HerringtonDarkholme @DanielRosenwasser
I would appreciate if you can look into it.

@DanielRosenwasser
Copy link

I'm currently not by a computer but I'll guess a bit. Right now it's probably an assignability error for props in general, but we can do better there in future versions of TypeScript. I'm currently on a branch where this works better.

The thing is that even on this branch, the best inference I can get is {}.

@HerringtonDarkholme
Copy link
Member

With #6850 , you can do this.

import Vue, { VNode } from "vue";

Vue.extend({
    name: "Workaround",
    props: {
        foo: { type: String },
        bar: {} as Prop<any>
    },
    render(h): VNode {
        return h("div", this.foo);
    }
});

I think inferring any from empty prop type is too lenient. A lot of options will have empty field, which results in empty type parameter. If we make inference default to any, there will be too many errors hidden by unintended any.

@yyx990803
Copy link
Member

Closing this one - please keep an eye on #6856 (to be merged for 2.6)

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

No branches or pull requests

5 participants