微信小程序接口封装（uniapp）

1.新建common文件夹,里面新建一个http.js文件，代码如下：

const BASE_URL = "http://localhost:8087" //公共请求头,端口号写你的
// const TOKEN = uni.getStorageSync('TOKEN') //TOKEN

const request = (url, method, data) => {
    
	return new Promise((resolve, reject) => {
    
			uni.request({
    
				url: BASE_URL + url, //仅为示例，并非真实接口地址。
				data: data,
				method: method,
				header: {
     //请求头可自定义
					'Content-Type': 'application/json'
					// 'X-Access-Token': TOKEN
				},
				success: (res) => {
     //具体捕获请看自己接口返回的形式
					if (res.data.status == 200) {
    
						resolve(res)
					} else {
    
						uni.showModal({
    
							title: '提示',
							showCancel: false,
							content: res.data.msg,
							success(res) {
    
								if (res.confirm) {
    
									// console.log('用户点击确定')
									uni.navigateBack({
    })
								} else if (res.cancel) {
    
									// console.log('用户点击取消')
								}
							}
						})
					}
				},
				fail(error) {
    
					reject(error)
				},
				complete() {
    

				}
			});

	})
}

export default {
    
	request  //向外暴露request
}

2.同样在common文件夹中新建request.js文件，代码如下：

import request from './http.js' //引入common中的http.js
const api = request
export default {
    

	// 登录
	userLogin: (data) => {
    
		return api.request('/user/login', 'POST', data) //接口地址
	},
	// 注册
	register:(data)=>{
    
		return api.request('/user/register','POST',data)
	}
}

3.在main.js中引入

import  myRequest  from './common/request.js'
// 挂载到全局使用
Vue.prototype.$myRequest = myRequest

4.在页面中使用

data() {
    
			return {
    
				login: {
    
					userName: '某某某',
					password: '00000000'
				}
			};
		},
methods:{
    
	login(){
    
			this.$myRequest.userLogin(this.login).then(res => {
    
			console.log(res)
		})
	}
}