uniapp 封装request请求

在request 文件夹 新建request.js

import main from "main.js"
export const request = (options) => {

	return new Promise((resolve, reject) => {
		let token = uni.getStorageSync('authorization')
		// 在登录的时候需要储存 token uni.setStorageSync("authorization","这里是登录获取的token值")
		uni.request({
			url: main.baseUrl + options.url,
			data: options.data || {},
			method: options.method || 'POST',
			header: options.header || {
				// 根据实际接口设计 key 取 token 或者 authorization
				authorization: token,
			},
			success: (res) => {
				console.log(res.data); // 控制台显示数据信息
				resolve(res.data)
			},
			fail: (err) => {
				// 页面中弹框显示失败
				uni.showToast({
					title: '请求接口失败'
				})
				// 返回错误消息
				reject(err)
			},
			catch: (e) => {
				console.log(e);
			}
		})
	})
}
// 将对象导出外部引入使用
export default {
	request
}

在main.js 下添加

//接口请求
export default {
	baseUrl: "http://192.168.0.18:8081"
}

页面中引用

	import request from "@/request/request.js"

绑定事件调用接口

	getcodes() {
				request.request({
					url: '/getPhoneCode',
					data: {
						username: this.username
					},
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					method: 'post',
				}).then(res => {
					console.log("------res------", res)
				})
			}

你可能感兴趣的:(前端,uni-app,前端,javascript)