vue3 app.config.globalProperties.$test 定义了全局变量,怎么使用
时间: 2024-09-20 10:11:39 浏览: 52
使用vite从头搭建一个vue3项目
在Vue 3 中,`app.config.globalProperties.$test` 是一种用于设置全局属性的方式,通常在 Vue 应用初始化的时候通过 `createApp()` API 来定义。这个 `$test` 变量可以像普通变量一样在应用的所有组件内访问,因为它已经添加到了全局作用域中。
例如,如果你在创建 App 实例时这样配置:
```javascript
const { createApp } = Vue;
const app = createApp(App);
// 定义全局变量 $test
app.config.globalProperties.$test = {
name: 'Test Value',
sayHello() {
console.log('Hello from global variable');
}
};
// 然后在任意组件中使用这个全局变量
export default {
setup() {
// 访问全局变量
const testValue = this.$test.name; // 获取 name 属性值
// 调用全局方法
this.$test.sayHello(); // 执行 sayHello 函数
return {};
}
};
```
要使用这个全局变量,只需要在组件内的 `setup()` 或者模板文件 `<script setup>` 中通过 `this.$test` 进行引用即可。
阅读全文