vue3.2之defineExpose

子组件：

<script setup lang="ts">
import { ref } from "vue"
const count = ref(2)

const handle = () => {
    console.log("这是一个子组件哟");
}

defineExpose({
    count,
    handle,
})
</script>

父组件

<script setup lang="ts">
import { ref } from "vue"
import { onMounted } from "@vue/runtime-core"
import Info from './info.vue'
const InfoRef = ref<{count: number, handle: () => void} | null>(null);

onMounted(() => {
    console.log(InfoRef.value?.count)  // 2
    InfoRef.value?.handle() // 这是一个子组件哟
})
</script>

<template>
    <Info ref="InfoRef" />
</template>