子组件
<script setup>
import { ref, reactive } from 'vue'
const isFlag = ref(false)
const data = reactive({
name: 'tom',
age: 18
})
//把数据导出
defineExpose({
data,
isFlag
})
</script>
父组件
<template>
//给组件绑定ref,从ref上获取
<Mode ref="refMode"></Mode>
</template>
<script setup>
import { ref ,reactive,onMounted} from 'vue'
import Mode from './view/mode.vue' //ref名称必须与绑定的名称相同
let refMode = ref(null)
console.log('refMode',refMode.value)
onMounted(() => { //只能在在里面才能获取到完整的组件ref的信息
console.log('refMode2',refMode.value) //通过解构获取
const {data,isFlag} = refMode.value;
console.log('refMode3',data,isFlag)
})
</script>
标签:由子,const,isFlag,refMode,data,vue3,组件,ref
From: https://www.cnblogs.com/anans/p/17278493.html