CODEWITHSUNDEEP
javascripttypescriptvue.jscompilation
Jae Woo Woo
Jae Woo Woo

Reputation: 1041

Vue with Typescript type check of props on compile time

I'm using Vue.js with Typescript. the code is simple. (with vue-class-component and vue-property-decorator)

<script lang="ts">
    import { Component, Prop, Vue } from 'vue-property-decorator';

    @Component
    export default class Child extends Vue {
        @Prop(String) private value!: string;
    }
</script>

Of course, if I pass string as props to Child component, it works without warning or error. And then passing number, it shows warning on runtime as below.

enter image description here

But No errors on compiling. Is there any way to check the types on "COMPILE" time?

Upvotes: 4

Views: 2282

Answers (1)

LPains
LPains

Reputation: 952

Transforming a comment into an answer...

When I had a similar problem it was related to how vue handle passing props to the component from template. if you use value="1" a string is passed, if you use :value="1" then a number is passed. This is indeed confusing and you only see it in runtime because the template is not compiled.

Upvotes: 4

Related Questions