uni-app封装请求方法

一、封装uni-request

const Tips = (title) => {
    
    
	uni.showToast({
    
    
		title
	})
}
const baseURL = process.env.NODE_ENV === 'development' ? "/dev-api" : "https://www.xxx.cn";

export default async function request(params) {
    
    
	return new Promise((reslove, reject) => {
    
    
		if(params.loading) uni.showLoading();
		
		uni.request({
    
    
			url: baseURL+params.url,
			method: params.method,
			header: {
    
    
				'Content-Type': 'application/json',
				'Token': uni.getStorageSync('TOKEN')
			},
			data: params.data,
			complete: () => {
    
    
				if(params.loading) uni.hideLoading();
			},
			success: (res) => {
    
    
				if (res.statusCode == 200) {
    
    
					if(res.data.code == 200) {
    
    
						reslove(res.data);
					} else if(res.data.code == 401){
    
    
						return Tips('登录过期,请重新登录');
					} else {
    
    
						return Tips(res.data.msg);
					}
				} else {
    
    
					return Tips('网络异常,请稍后再试!');
				}
			},
			fail: (err) => {
    
    
				return Tips('连接失败,请稍后再试!');
			}
		})
	})
}

二、使用步骤

1.api.js

代码如下(示例):

import request from './request.js'

export function getUserInfo(uid) {
    
    
    return request({
    
    
        url: '/user/info',
        method: 'GET',
        data: {
    
    
            uid
        },
        loading: true, //是否开启loading动画
    })
}

2.页面引入

代码如下(示例):

//xxx.vue
import {
    
     getUserInfo } from 'api.js'

getUserInfo().then(res => {
    
    

})

该处使用的url网络请求的数据。


猜你喜欢

转载自blog.csdn.net/qq_41939902/article/details/128642272