vue3父子组件传值和双向数据绑定

父 
<apple :username="username" @closez="close" v-model:key="key"></apple>

let username =ref('张三')
const key = ref('123456')
const close = (e)=>{
  console.log("子传递",e);
  
}

子
<template>
 <input v-model="username"/>
 <button @click="handleData">发送数据</button>
</template>
<script lang="ts" setup>

import { ref} from "vue";
import { string } from "vue-types";
let username = ref('')
let pwd = ref('')

const props = defineProps({
    username:{
        type:string,
        default:''
    }
})

const emit = defineEmits(['closez','update:key'])

const handleData = ()=>{
    pwd.value = "123456";
    emit('closez',pwd.value)
    emit('update:key','14')
}
console.log("父数据",props.username);

</script>