uniapp+vue3+ts封装公共的请求

uniapp封装公共请求ts版

第一步：新建文件夹utils
第二步：新建文件request.ts

//服务器接口地址
const baseURL : string = 'http://xxxxxx'
//本地调试接口地址
// const baseURL:string='http://xxxxxx'
// 封装公共请求方法
function request(url : string, method : "GET" | "POST" | undefined, data : object | any) {
	return new Promise(function (resolve, reject) {
		let header : any
		if (uni.getStorageSync('token') !== undefined && uni.getStorageSync('token') !== "") {
			header = {
				'content-type': 'application/json',
				'Token': uni.getStorageSync('token')
			};
		} else {
			header = {
				'content-type': 'application/json',
			};
		}
		uni.request({
			url: baseURL + url,
			method: method,
			data: data,
			header: header,
			success(res : any) {
				console.log(res)
				uni.hideLoading()
				if (res.data.code === "200") {
					resolve(res.data);
				} else {
					//其他异常
					uni.showToast({
						title: res.data.msg,
						icon: 'none'
					})
					reject(res.data);
				}
			},
			fail(err) {
				uni.hideLoading()
				//请求失败
				uni.showToast({
					title: '无法连接到服务器',
					icon: 'none'
				})
				reject(err)
			}
		})
	})
}
export { request, baseURL }

第三步：新建文件夹api
第四步：新建文件api.ts

import {request} from './request'
//登录接口
const login = (data: object | any)=>request('/corp_auth/admin_login', 'POST', data)
 // 首页获取商品列表
const getList =(data: object | any)=>request('/goods/get_all_goods_by_collieryid', 'GET', data)

export{
    login,
    getList
}

接着在（列如）首页index.vue引入需要的接口

<script setup lang="ts">
    import { getList } from '../../../services/api';
  getList({ pageNow: this.pageNow}).then(res => {
          that.list = that.list.concat(res.data.payload)
	})           
</script>