uni-app简单请求封装以及公共api请求管理

代码如下以示、

第一次写博客,如有不清晰的可评论指出、(点赞鸭、)

//可以新建一个单独的js文件放此代码




let best_url;
//判断环境,以及设置公共基础url
if (process.env.NODE_ENV === 'development') { 
//开发环境url
	best_url = 'https://www.dev.baidu.com/'  //记得改为自己的基础url
} else { 
//生产环境url
	best_url = 'https://www.pro.baidu.com/' //记得改为自己的基础url
}

const axios = function(url, data = {}, method = "POST", showLoading = true) {
		//接口请求
		//交互提示框,根据自己需求来决定是否需要
		if (showLoading) {
			uni.showLoading({
				mask: true,
				title: '请稍候...'
			})
		}
		return new Promise((resolve, reject) => {
			uni.request({
				url: best_url + url,
				data: data,
				header: {
					//可以引入vuex去做一个三目运算,判断是否需要携带token,我这边是写了,根据自己需求来哦、
					'token': this.has_login ? this.vuex_token : '',
				},
				method: method, //'GET','POST'
				dataType: 'json',
				success: (res) => {
					//这里做了一个code判断、根据自个需求,自行删减
					if(res.statusCode >= 200 && res.statusCode < 300){
						showLoading && uni.hideLoading()
						resolve(res)
					}else{
						reject()
					}
					
				},
				fail: (res) => {
					if (showLoading) {
						this.$toast("网络不给力,请稍后再试~", 'none')
					}
					reject(res)
				}
			})
		})
	}


//api 管理
const article = {
    // 商品列表
    goods_list (data) {
        return axios.get('/goods/list/',data,'GET',false);
    },
}

export default article;

//设置完之后去mian.js引入并挂载至全局,即可所有页面去调用、
//调用方法示例 

/*
函数中可传参 如 goods_list({
a : 0,
b : 1,
等等
})
this.$api.goods_list().then( res =>{

}).catch ( err =>{

})*/


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