es6 Promise封裝ajax

 利用Promis 做一個簡單的 數據請求封裝。

function requestP(options = {}) {
  const {
    url,
    data,
    type,
    async,
    header,
    dataType,
    responseType,
    success,
    fail,
    complete
  } = options;

  return new Promise((res, rej) => {
    $.ajax({
		type:type||"post",
		url: url,
		dataType: "json",
		data: data||"",
		async:async||true,
		error: function(err) {
			console.log("err",err);
			console.log("失敗:" + JSON.stringify(err));
			mui.toast("網絡出錯,請檢查網絡連接!");
			rej(err);
		},
		success: function(data) {
			if(data.error_code > 0) {
				//console.log(data);
				console.log( JSON.stringify(data));
				rej(data);
				if(data.msg == "訪問令牌不存在或已失效") {
					mui.toast("訪問令牌不存在或已失效,請退出從新登陸");
				} else {
					mui.toast(data.msg);
				}
			}
			if(data.error_code == 0) {
				res(data);
			}
		},
		complete: function() {
			mui.hideLoading();
		}
	});
    
  });

}
function isHttpSuccess(status) {
  return status >= 200 && status < 300 || status === 304;
}
/**
 * ajax高級封裝
 * 參數:[Object]option = {},參考wx.request;
 * [Boolen]keepLogin = false
 * 返回值:[promise]res
 */
function req(options = {}, keepLogin = true) {
  if (keepLogin) {
    return new Promise((res, rej) => {
          // 獲取sessionId成功之後,發起請求
          requestP(options)
            .then((r2) => {
              if (r2.rcode === 401) {
              console.log("登陸失效")
              } else {
                res(r2);
              }
            })
            .catch((err) => {
              // 請求出錯
              rej(err);
            });
       
    });
  } else {
    // 不需要sessionId,直接發起請求
    return requestP(options);
  }
}

 

const apiUrl = '';

const R = {
  //獲取公司列表
  get_company_list(data) {
    const url = `${apiUrl}/member/Company/lst`
    return req({ url, data });
  },
  //綁定微信
	bind_wx(data){
		const url = `${apiUrl}/member/Index/bind`
    return req({ url, data });
	},
	//獲取積分列表
	get_member_score_list(data){
		const url = `${apiUrl}/member/member_score/ajaxList`
    return req({ url, data });
	},
	//獲取會員卡
	get_member_card_list(data){
		const url = `${apiUrl}/member/member_card/ajaxList`
    return req({ url, data });
	},
	//獲取儲值列表
	get_balance_list(data){
		const url = `${apiUrl}/member/balance/ajaxList`
    return req({ url, data });
	},
	
	//獲取訂單列表
	get_order_list(data){
		const url = `${apiUrl}/member/order/ajaxList`
    return req({ url, data });
	},
	
	//獲取門店列表
	get_store_list(data){
		const url = `${apiUrl}/member/store/ajaxList`
    return req({ url, data });
	},
	
	//獲取會員詳情
	get_member_detail(data){
		const url = `${apiUrl}/member/member/detail`
    return req({ url, data });
	},
	
	//獲取優惠券列表
	get_coupon_list(data){
		const url = `${apiUrl}/member/coupon/ajaxList`
    return req({ url, data });
	},
	
	//獲取優惠券數量
	get_coupon_count(data){
		const url = `${apiUrl}/member/coupon/usableCount`
    return req({ url, data });
	},
	
}

然後可以把,所有的 接口都寫到同一個 js中。

在別的頁面只需要引入這2個js 調用 R.get......這類的 函數 用 .then 就可以獲取數據了

如果感興趣,也可以關注我的微信公衆號,因爲剛起步,所以只有幾篇文章,之後會慢慢更新。

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章