第一步、根目录下新建 config.js 文件

const config = {
base_url: '这里可以是生产环境或者测试环境'
}
export { config }

第二步、根目录下新建 https/index.js 文件

import {
	config
} from '../config.js'

export const apiResquest = (prams) => { //prams 为我们需要调用的接口API的参数 下面会贴具体代码

	// 判断请求类型
	let headerData = {
		'content-type': 'application/json'
	}

	let dataObj = null
        //因为我们的GET和POST请求结构不同这里我们做处理,大家根据自己后台接口所需结构灵活做调整吧
	if (prams.method === "GET") {
		headerData = {
			'content-type': 'application/json',
			'token': uni.getStorageSync('token')
		}
	} else {
		dataObj = {
			'data': prams.query,
			'token': uni.getStorageSync('token')
		}
	}
	return new Promise((resolve, reject) => {
		let url = config.base_url + prams.url; //请求的网络地址和局地的api地址组合
		uni.showLoading({
			title: '加载中',
			mask: true
		})
		return uni.request({
			url: url,
			data: dataObj,
			method: prams.method,
			header: headerData,
			success: (res) => {
				uni.hideLoading()
                                //这里是成功的返回码,大家根据自己的实际情况调整
				if (res.data.code !== '00000') {
					uni.showToast({
						title: '获取数据失败:' + res.data.msg,
						duration: 1000,
						icon: "none"
					})
					return;
				}
				resolve(res.data);
				console.log(res.data)
			},
			fail: (err) => {
				reject(err);
				console.log(err)
				uni.hideLoading()
			},
			complete: () => {
				console.log('请求完成')
				uni.hideLoading()
			}
		});
	})
}

第三步、 根目录下新建 https/app.js 文件

import { apiResquest } from '../utils/http.js'

//POST 请求案例

export const login = (query) => {
	return apiResquest({
		url: '这里是API的地址',
		method: 'POST',
		query: {...query}
	})
}

//GET 请求案例可以传递参数也可以不传递
export const validateCode  = (query) => {
	let str = query
	return apiResquest({
		url: `您的API地址 ?${str}`,
		method: 'GET'
	})
}

第四步、页面中调用

import { login } from '../../models/index.js'
//页面中的 methods 里面就可以直接调用了
Login(){
        //这里可以设置需要传递的参数
	let uid = uni.getStorageSync('userId')
	login(uid).then((res) => {
		console.log(res)
	}).catch(err => {
		console.log(err)
	})
}
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐