vue3 provide,inject使用

父组件

<template>
    <C></C>
</template>

<script setup lang="ts">
    import { provide,inject,ref,onMounted,defineAsyncComponent} from 'vue';
    const C = defineAsyncComponent(() =>
      import('./C.vue')
    )
    
    const message=ref('sblc')
    const saySB=(msg)=>{
        console.log('lc'+msg)
    }
    provide('msgKey',message)
    provide('sayKey',saySB)
    
</script>

子组件

<template>
    
    <div>{{msgKey}}</div>
    
</template>

<script setup lang="ts">
    import { inject,ref,onMounted} from 'vue';
    const msgKey= inject('msgKey',ref('dashabi')) //添加默认值
    const sayKey =inject('sayKey')
    onMounted(()=>{
        sayKey('傻逼')
    })
    
</script>