vue3挂载全局变量-我爱编程

vue3挂载全局变量

1、查看已挂载的全局变量

import App from "./App.vue"

const app = createApp(App)

console.log(app.config.globalProperties)

2、设置全局变量

import App from "./App.vue"

const app = createApp(App)

app.config.globalProperties.$foo = {
  name: 'foo'
}

官方介绍：https://cn.vuejs.org/api/application.html#app-config-globalproperties

3、setup方式使用全局变量

<script setup>
import { getCurrentInstance } from "vue"

const { proxy } = getCurrentInstance()

console.log(proxy.$foo)
</script>

4、option方式使用全局变量

<script>
export default {
  mounted() {
    console.log(this.$foo)
  }
}
</script>

在模板中使用全局变量

<template>
  <div>{{ $foo.name }}</div>
</template>

免责申明：本站发布的内容（图片、视频和文字）以转载和分享为主，文章观点不代表本站立场，如涉及侵权请联系站长邮箱：xbc-online@qq.com进行反馈，一经查实，将立刻删除涉嫌侵权内容。