第一步：導(dǎo)入luch-request包

image.png

第二步：創(chuàng)建common.js配置文件，并配置一下內(nèi)容

import Request from '@/js_sdk/luch-request/luch-request/index.js'
export const apiBaseUrl = 'http://www.baidu.com'


const api = new Request()
const http = new Request()

http.config.header = {website:'123dfdf465132'}
api.config.header={website:'123dfdf465132'}

/* 設(shè)置全局配置 */
api.setConfig((config) => { 
  config.header = {...config.header,a: 1111111, b: 2222}
  return config
})


//請(qǐng)求前攔截，用來動(dòng)態(tài)加參,例如token
api.interceptors.request.use((config) => { // 可使用async await 做異步操作
  config.baseURL = apiBaseUrl
  config.header = {...config.header,token:"not setting"}

  // 演示custom 用處
  // if (config.custom.auth) {
  //   config.header.token = 'token'
  // }
  if (config.custom.loading) {
   uni.showLoading({
        title:"加載中..."
    })
  }
  /**
   /* 演示
   if (!token) { // 如果token不存在，return Promise.reject(config) 會(huì)取消本次請(qǐng)求
      return Promise.reject(config)
    }
   **/
  return config
}, config => { // 可使用async await 做異步操作
  return Promise.reject(config)
})


// 請(qǐng)求后
api.interceptors.response.use(async(response) => {
//   console.log(response)
  if (response.config.custom.loading) {
    uni.hideLoading()
  }
  return response
}, (response) => { /*  對(duì)響應(yīng)錯(cuò)誤做點(diǎn)什么 （statusCode !== 200）*/
//   console.log(response)
//   console.log(response.statusCode);
//   //未登錄時(shí)清空緩存跳轉(zhuǎn)
//   if(response.statusCode ==401){
//    uni.clearStorageSync();
//    uni.switchTab({
//      url:"/pages/user/user"
//    })
//   }
  return Promise.reject(response)
})


export {http,api}

第三步：創(chuàng)建接口文件 api/index.js

import { http,api } from '@/config/common.js' // 全局掛載引入，配置相關(guān)在該common.js文件里修改

export default {
    /**
     * @param {Object} url 接口地址
     * @param {Object} data 數(shù)據(jù)
     * @param {Object} loading 是否顯示加載提示框
     */
    getData(url,data,loading) {
        return api.get(url,{custom: {loading: loading}}, {params: data});
    },
}

第四步：頁(yè)面中使用

import TestApi from "@/api/index.js";
TestApi.getData(url,data,true).then(res=>{
   if(res.statusCode==200){

   }else{
       uni.showToast({icon:'none',title:res.errMsg})
   }
})