how can i type check the data sent to a vue component?

I think you should configure your IDE for this properly.

I am using VSCode and the VSCode Extension Vetur https://github.com/vuejs/vetur

<script lang="ts">
import Vue from 'vue';

export default Vue.extend({
    name: 'Home',
    data: function() {
        return {
            message: 'Hello Vue!',
            seconds: 0,
        };
    },
    created() {
        setInterval(() => {
            this.econds = 'asd';
        }, 1000);
    },
});
</script>

In combination with <script lang="ts"> Vetur tells you for this.econds that this does not exist and displays the message:

Property ‘econds’ does not exist on type ‘CombinedVueInstance<Vue, { message: string; seconds: number; }, unknown, unknown, Readonly<Record<never, any>>>’. Did you mean ‘seconds’?Vetur(2551)

No compile step needed, it is on the fly.

Is this what you need?

CLICK HERE to find out more related problems solutions.

Leave a Comment

Your email address will not be published.

Scroll to Top