uni-app二次封装接口请求

uni-app二次封装接口请求，使用Promise实现链式回调

class HTTP {
	request({
		url,
		data = {},
		method = 'POST'
	}) {
		return new Promise((resolve, reject) => {
			this._request(url, resolve, reject, data, method)
		})
	}
	
	_request(url, resolve, reject, data, method) {
		uni.request({
			url: `${apiUrl}/${merchant_id}${url}`,
			method: method,
			data: method==='POST' ? qs.stringify(data) : data,
			header: {
				'Content-Type': 'application/x-www-form-urlencoded',
				'Authorization': 'Bearer ' + auth.getToken(),
				'from-id': getApp() != undefined ? getApp().globalData.from_id : ''
			},
			success: (res) => {
				const code = res.statusCode.toString()
				if (code.startsWith('2')) {
					// 请重新登录
					if (res.data.code === 202) {
						uni.clearStorageSync()
						getApp().globalData.isLogin = 1
						this.$Router.pushTab({
							path: '/pages/user/index'
						})
						return
					}
					// 数据响应
					if (res.data.code === 200) {
						resolve(res.data.data)
					} else {
						this.show_error(res.data.message)
						reject(res.data.message)
					}
				} else {
					reject()
					this.show_error(res.data.message)
				}
			},
			fail: (err) => {
				reject()
				this.show_error('网络错误')
			}

		})
	}
	show_error(msg) {
		wx.showToast({
			title: msg,
			icon: 'none',
			duration: 2000
		})
	}
	
}

export {
	HTTP
}


实战使用：

第一：创建model目录，底下在创建apiModel.js
import {
	HTTP
} from '../utils/http.js'

class apiModel extends HTTP {
	
	// 商户登录
	Auto_Login(data={}) {
		return this.request({
			url: '/auth/login',
			data: data
		})
	}
}

const api = new apiModel()

export {
	api
}


第二：挂载在main.js中
import { api } from './model/apiModel.js'
Vue.prototype.$Api = api;

第三：组件上使用
this.$Api.Home_Data({
    page:1,
    pageSize:10
}).then(res => {
	this.homeData = res
	this.isLoading = false
})