背景
在vue3项目中，多个组件需要获取到后端请求api地址。api地址显然是可以在全局获取的，然后延伸出一个问题，如何在vue3中获取到全局内容呢？
使用import（推荐）
通过模块化的方式定义全局变量或者函数并导出。在setup中导入。
//common.js
export const baseUrl = 'http://122.11.11.11'
// APP.js
<script setup>
import { baseUrl } from './common.js'
console.log(baseUrl) // 输出 http://122.11.11.11
</script>
使用provide/inject(推荐)
在vue中，跨多层级（>2）之间的传参，如果仅使用 props 则必须将其沿着组件链逐级传递下去，这会非常麻烦。vue3提供了更加便捷的传参方式：依赖注入。依赖注入可以应用在整个应用层面。
// main.js
import { createApp } from 'vue'
const app = createApp({})
app.provide('globalUrl',' http://122.11.11.11')
// APP.js
<script setup>
import { inject } from 'vue'
const message = inject('message')
</script>
访问Vue实例或全局Vue应用实例(不推荐)
//main.js
import { createApp } from 'vue'
import App from './App.vue'
const app = createApp(App)
app.config.globalProperties.globalData = 'common-js'
app.mount('#app')
<script setup>
import { getCurrentInstance } from 'vue';
const globalContent = getCurrentInstance();
console.log(globalContent.appContext.config.globalProperties);
</script>
通常不推荐这样做，因为它破坏了 <script setup> 的封装性，而且这是 Vue 的内部 API，可能在未来的版本中更改。
使用Vuex 或者Pinia状态管理库（适用复杂应用）
对于更复杂的应用，全局状态管理库如 Vuex 或 Pinia 是更推荐的方式。这些库允许你在应用的任何组件中通过访问共享的状态仓库来获取全局内容。
优点：状态管理清晰，易于追踪和维护；支持跨组件通信和状态共享。
使用环境变量或者配置环境（推荐）
可以通过环境变量或配置文件来管理它们，并在构建时将它们注入到应用中。
如果使用的是vite， 则可以通过import.meta.env, .env配置文件
优点：安全、灵活，便于管理不同环境下的配置。
通过全局混入Mixin
Mixin在vue2中用的多，在vue3中推荐使用Composition API。
总结
在 Vue 3 的 <script setup> 中获取全局内容，最推荐的方法是使用 Vuex 或 Pinia 等状态管理库，以及通过全局混入和环境变量/配置文件来管理全局常量。
对于需要在多个组件之间共享的数据或功能，推荐provide 和 inject 。
不推荐使用 getCurrentInstance。
