vue3.2+ts 父子组件传值

child.vue

<template>
    <div class="child">
        <span>{{title}}</span>
        <button @click="onClick">跳转</button>
    </div>
</template>
<script lang="ts" setup>
 import { withDefaults, defineProps, defineEmits } from 'vue'

 interface Props{
     title?:string
 }

 const props = withDefaults(defineProps<Props>(), {
     title: '标题'//默认值
 })

 interface Emits{
     (e:'link', data: object): void
 }

 const emits = defineEmits<Emits>()
 const onClick = ():void => {
  emits('link', { text: props.title })
 }
</script>

parent.vue

<template>
    <div>
        <child title="测试" @link="handleLink"></child>
    </div>
</template>
<script lang="ts" setup>
  import child from '@/components/child.vue'

  const handleLink = (e:object):void => {
    console.log(e.text)//测试
  }
</script>