再度复习uni-app请求接口的封装

前言：

愈发觉得封装请求接口方法和封装api地址非常重要，觉得这是一个好的项目开发必备的步骤，于是在仿美团app项目中又复习了一遍接口封装

上码：

1.请求接口方法的封装：

myRequest.js

//myRequest.js
//向该方法传递对象作为参数
export const myRequest =(option)=>{
	return new Promise((resolve,reject)=>{
		uni.request({
			url:option.url,
			method:option.method||'GET',//若不填默认为GET请求
			data:option.data||{},//若不填默认为空对象
		})
		.then((res)=>{
			resolve(res)
		})
		.catch((err)=>{
			uni.showToast({
				title:'请求接口失败'
			})
			reject(err)
		})
		
	})
}

index.vue

//index.vue
	import {myRequest} from '../../api/myRequest.js'
		methods: {
			preference(){
                myRequest(getPrefernce)
				.then((res)=>{
					this.prefer=res[1].data
				})
				.catch((err)=>{
					console.log((err))
				})
			}
		}

注：前几天复习了Promise对象，主要就是Promise这个对象中会有两种结果，resolve和reject,但是不在promise对象体中处理结果 ，而是留在外部的then()和catch()处理，成功就在then()处理，失败就在catch()处理，而封装的意义就是省去了一些需要重复处理的参数如GET、data等。以及直接返回promise的结果，使得我们更多只用关注对数据的处理。

2.API的封装：
这也是我看了视频中老师教的，之前学的都是最多公共地址拼接，现在直接外多了个专门存放api的js代码封装，愈发觉得小程序就是不停的封装。

上码：

apis.js

let BaseUrl= 'https:/meituan.thexxdd.cn/api'//公共接口地址

let getPrefernce= {url:`${BaseUrl}/forshop/getprefer`}//为你优选接口地址

export{getPrefernce}//为你优选接口地址导出

就是将各种接口地址都放在一个js文件中，拼接啥的也都在这个文件处理，最后需要哪个接口就导出导入哪个接口就好。其中的${}加反引号的拼接方式是es6 的新语法

总结：

使劲封装就完事了！