vue3 设置全局变量

在 Vue3 中，可以使用 `createApp` 函数的 `provide` 方法来设置全局变量。

例如，假设我们要在整个应用程序中使用一个名为 `config` 的全局变量，我们可以这样设置：

import { createApp } from 'vue';
import App from './App.vue';

const app = createApp(App);

app.provide('config', {
  apiUrl: 'https://example.com/api',
  maxItems: 10,
});

app.mount('#app');

在上面的示例中，我们使用 `provide` 方法将一个对象作为全局变量提供给应用程序。我们可以在任何组件中使用 `inject` 方法来访问这个全局变量。

例如，在一个组件中，我们可以这样使用全局变量：

import { inject } from 'vue';

export default {
  setup() {
    const config = inject('config');
    
    console.log(config.apiUrl); // 输出 https://example.com/api
    console.log(config.maxItems); // 输出 10
  }
}

需要注意的是，由于 `provide` 和 `inject` 是基于组件树的，因此如果在某个组件中使用 `provide` 方法设置了一个全局变量，它只能被其子孙组件使用。如果需要在整个应用程序中使用，应该在根组件中使用 `provide` 方法设置全局变量。