父
<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>
vue3父子组件传值和双向数据绑定
最新推荐文章于 2023-12-15 12:11:53 发布
![](https://img-home.csdnimg.cn/images/20240711042549.png)