uni-app封装request请求,用于接口对接

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

用于配置项目的域名

const config = {
    base_url: '项目域名'
}
export { config }

二、根目录下新建 utils/http.js 文件

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

export const apiResquest = (prams) => { 

//prams是调用的接口API的参数

	//请求头设置
	let headerData = {
		'content-type': 'application/json'
	}

	
	return new Promise((resolve, reject) => {
		let url = config.base_url + prams.url; //请求的网络地址和局地的api地址组合
		uni.showLoading({
			title: '加载中',
			mask: true
		})
		return uni.request({
			url: url,
			data: prams.query,
			method: prams.method,
			header: headerData,
			success: (res) => {
				uni.hideLoading()
                 //这里是成功的返回码,根据自己的实际情况调整
				if (res.data.code == '200') {
					console.log('请求成功:' + res.data.msg)
					return;
				}else{
                    console.log('请求失败:' + res.data.msg)
					return;
                }
				resolve(res.data);
				console.log(res.data)
			},
			fail: (err) => {
				reject(err);
				console.log(err)
				uni.hideLoading()
			},
			complete: () => {
				console.log('请求完成')
				uni.hideLoading()
			}
		});
	})
}

三、创建api层,根目录下新建 api/index.js 文件

api文件夹里可以根据自己的项目功能需求创建多个js文件

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

//POST 请求案例

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

//GET 请求案例
export const getData  = (query) => {
	return apiResquest({
		url:'这里是API的地址',
		method: 'GET',
        query: {...query}
	})
}

四、页面中调用

import { login } from '../../api/index.js'

//在 methods 里直接调用
Login(){
        
	let data = {
        //这里可以设置需要传递的参数
    }

	login(data).then((res) => {
		console.log(res)
	}).catch(err => {
		console.log(err)
	})
}

 

  • 2
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值