在Vue 3和TypeScript项目中，可以通过Provide/Inject API或者使用Vuex来创建全局可用的对象。这里提供一个使用Provide/Inject API的简单示例：
- 首先，创建一个全局对象，比如
api.ts：
// api.ts
export const api = {
getData() {
return new Promise((resolve) => {
// 模拟API调用
setTimeout(() => {
resolve({ data: '这是从全局API获取的数据' });
}, 1000);
});
}
};- 在主入口文件（如
main.ts）中，提供这个对象：
// main.ts
import { createApp } from 'vue';
import App from './App.vue';
import { api } from './api'; // 引入全局对象
const app = createApp(App);
// 使用provide方法提供全局对象
app.provide('globalApi', api);
app.mount('#app');- 在任何组件中，使用inject方法来使用这个全局对象：
// 组件中的script部分
import { inject } from 'vue';
export default {
setup() {
// 使用inject方法注入全局对象
const globalApi = inject('globalApi');
// 使用全局对象的方法
const fetchData = async () => {
const data = await globalApi.getData();
console.log(data);
};
return {
fetchData
};
}
};- 在组件模板中，可以通过点击按钮来调用全局对象的方法：
<!-- 组件模板部分 -->
<template>
<button @click="fetchData">获取全局数据</button>
</template>这样，你就创建了一个全局可用的对象接口，并在Vue 3和TypeScript项目中通过Provide/Inject API使用它。