美文网首页
Vue3---Vue3中如何进行全局挂载

Vue3---Vue3中如何进行全局挂载

作者: 小李不小 | 来源:发表于2021-06-27 18:16 被阅读0次

main.js中通过 config.globalProperties 进行全局挂载

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
 
const app = createApp(App)
app.use(store)
app.use(router)
app.mount('#app')
 
// Vue3 全局挂载系统名称
app.config.globalProperties.$systemName = '用户管理系统'

组件实例中通过 getCurrentInstance 获取proxy,再获取全局挂载的实例

<template>
  <div>
    <p>{{ sysName }}</p>
  </div>
</template>
<script>
import { defineComponent, getCurrentInstance } from 'vue'
 
export default defineComponent({
  name: '',
  setup(){
    const { proxy } = getCurrentInstance()
    const sysName = proxy.$systemName
    return {
     sysName
    }
  }
})
</script>

相关文章