Skip to content

buggy type inference for props with array type #7895

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

Closed
indus opened this issue Mar 26, 2018 · 3 comments
Closed

buggy type inference for props with array type #7895

indus opened this issue Mar 26, 2018 · 3 comments

Comments

@indus
Copy link

indus commented Mar 26, 2018

Version

2.5.16

Reproduction link

https://raw.githubusercontent.com/indus/stuff/master/vue_issue.jpg
(sorry - haven't found an online tool that shows type annotations)

Steps to reproduce

type the following in an TS enabled Editor like VS Code:

new Vue({
    el: '#app',
    props: {
        object: {
            type: Array,
            required: true,
            default: () => []
        }
    },
    data: function () {
        return {
            message: 'Hello Vue.js!'
        }
    },
    created: function () {
        this.message;
    }
})

What is expected?

correct type inference (at least) for 'message'

What is actually happening?

getting Error: "Property 'message' doesn't exist"


This doesn't happen when the type of the prop is Object:

new Vue({
    el: '#app',
    props: {
        object: {
            type: Object,
            required: true,
            default: () => {}
        }
    },
    data: function () {
        return {
            message: 'Hello Vue.js!'
        }
    },
    created: function () {
        this.message;
    }
})

or 'data' is just a simple object and not a function

new Vue({
    el: '#app',
    props: {
        object: {
            type: Array,
            required: true,
            default: () => []
        }
    },
    data: {
        message: 'Hello Vue.js!'
    },
    created: function () {
        this.message;
    }
})
@ktsn
Copy link
Member

ktsn commented Mar 26, 2018

This looks like duplicate of #7640 if you are using TypeScript 2.7.
If it's not the same issue, please provide a example github repo that reproduce it.

@HerringtonDarkholme
Copy link
Member

This is exactly the duplicate of #7640.

type: Array breaks the overloading function Vue.extend. The last alternative of overloading is picked so this-type isn't included.

The workaround is manual annotation.

import Vue, {PropOptions} from "vue"

Vue.extend({
    props: {
        myProp: {
            type: Array,
        } as PropOptions<any[]>,
    },
})

@ffxsam
Copy link

ffxsam commented Feb 22, 2019

@HerringtonDarkholme Thanks for that workaround. Kind of hard to believe this is still an issue.

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

4 participants