Vue 3 获取当前应用程序实例

Question

如何访问组件内应用程序的当前实例？

Answer 1

选项 1：创建插件

// define a plugin
const key = "__CURRENT_APP__"
export const ProvideAppPlugin = {
    install(app, options) {
        app.provide(key, app)
    }
}
export function useCurrentApp() { 
    return inject(key) 
}

// when create app use the plugin
createApp().use(ProvideAppPlugin)

// get app instance in Component.vue
const app = useCurrentApp()
return () => h(app.version)

选项 2：使用内部 apigetCurrentInstance

import { getCurrentInstance } from "vue"
export function useCurrentApp() {
    return getCurrentInstance().appContext.app
}

// in Component.vue
const app = useCurrentApp()