vue3+ts vue-property-decorator 父

地址:https://github.com/kaorun343/vue-property-decorator

怎么使vue支持ts写法呢,我们需要用到vue-property-decorator,这个组件完全依赖于vue-class-component.

首先安装:

npm install vue-property-decorator

引入

import {prop} from 'vue-property-decorator'

父传子

1 父组件

<template>
  <div>
    <h1>父</h1>
    <tab  :nav='1'></tab >
</div>
</template>
<script lang="ts">
    import tab from './tab.vue'; //子组件

    export default class  fn extends Vue{
        get ValA(){
            return 1;
        }
    }
</script>

2 子组件

<template>
  <div>
    <h1>父</h1>
    <tab  :nav='1'></tab >
</div>
</template>

<script lang="ts">
    import {prop} from 'vue-property-decorator';

    export default class zi extends Vue{
    @prop(numebr) //numebr是申明类型
    private  nav;

//@Prop(Number) readonly propA: number | undefined 
}

created(){
conosle.log('父组件传的值nav--',nav)
}
  

        get ValA(){
            return 1;
        }
    }
</script>