1、依赖注入

//main.ts中
app.provide("globalKey",ref("Agwenbi"));//全局变量
app.provide("globalFunc",(str:string):void => {//全局函数
    console.log(str);
});

//xxx.vue中
import { defineComponent,inject,ref } from 'vue'
export default defineComponent({
    setup () {
        const agwenbi = inject("Agwenbi",ref<string>("默认值"));//如果全局变量不存在的话，会使用默认值
        const globalFunc = inject("globalFunc",(str:string):void => {//如果全局函数不存在的话，会使用默认的函数
            console.log("默认执行的函数");
        });
        return {
            agwenbi,globalFunc
        }
    }
})

2、use的使用

//myBtn.vue组件
<template>
    <div>
        <button>{{btnText}}</button>
    </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
    name:"myBtn",//组件name值
    props:{
        btnText:{
            type:String,
            default:"自定义按钮"
        }
    },
    setup () {
        return {}
    }
})
</script>
<style scoped>
</style>

//glboalCom.ts
import myBtn from "@/components/myBtn.vue";
import {App} from 'vue'
interface GlobalCom{
    components:string[]
}
const comps = [myBtn];//全局的组件信息
export default{
    install(app:App<Element>,options:GlobalCom){
        console.log(app);//当前的app实例
        console.log(options);//传入的自定义信息
        options.components.forEach((comp:string) => {
            const tempCom = comps.find(item => item.name === comp);//通过组件名找到对应的组件
            tempCom && app.component(tempCom.name,tempCom);//如果存在，注册当前组件
        });
    }
}

//main.ts
import { createApp} from 'vue'
import App from './App.vue'
import globalCom from '@/assets/globalCom';

const app = createApp(App);
app.use(globalCom,{
    components:["myBtn"]//这里传入的是组件的name值
})
app.use(store).use(router).mount('#app');

//xxx.vue在任意的组件中使用
<template>
    <myBtn :btnText="btnText"></myBtn>
</template>

<script lang="ts">
import { defineComponent,ref } from 'vue'
export default defineComponent({
    setup () {
        const btnText = ref<string>("我是一个全局组件的按钮");
        return {
            btnText
        }
    }
})
</script>

<style scoped lang="scss">
</style>