1.新建一个api.js,例举一个登录,有多个接口都可以写在api.js
var loginInfo = '/app/appuser/login';
........多个var省略
export default {
    // login:login,//登陆
	loginInfo:loginInfo,
	..........多个变量省略
};



2.新建一个request.js,用来封装接口
const Url ='http://接口地址'; 
//登陆 ,未绑定时进行绑定 请求 
function loginRequest(url,data){
	var promise = new Promise((resolve,reject)=>{
	var that = this;
	var params = data;
	
	uni.request({
	     url:Url + url,
	     data:params,
	     method:'POST',
	   header:{
	     'content-type': 'application/x-www-form-urlencoded'
	   },
	     success:function(res){
	        resolve(res)
	     },
	     error:function(error){
	        reject(error)
	     }
	})
 })
	  return promise
}

//get请求封装
function getRequest(url,data,token){
   var promise = new Promise((resolve,reject)=>{
       var that = this;
       var params;
	   if(data == undefined || data == ""){
		   params = {};
	   }else{
		   params = data;
	   }
       uni.request({
            url:Url + url,
            data:params,
            method:'GET',
          header:{
            'content-type': 'application/x-www-form-urlencoded',
			'Authorization': token
          },
            success:function(res){
					// uni.hideLoading();
               resolve(res)
			
            },
            error:function(error){
					// uni.hideLoading();
               reject(error)
			    // console.log('js里面的token',token);
            }
       })
   })
   return promise
}


//post请求封装
//post 封装
function postRequest(url,data,token){
    var promise = new Promise((resolve,reject)=>{
        var that = this;
        var params = data;
        uni.request({
            url:Url+url,
            data:params,
            method:'POST',
            header:{
              'content-type': 'application/x-www-form-urlencoded',
			  'Authorization':token
            },
            success:function(res){
               resolve(res)
            },
            error:function(error){
               reject(error)
            }
        })
    })
    return promise
}

//将封装的请求方法供外部访问
export default{
	postRequest:postRequest,
	getRequest:getRequest,
	loginRequest:loginRequest
}

3.新建一个httpApi.js文件
const Url ='http://www.hn...';//服务接口地址
export default{
	Url:Url,//接口请求头
}

4.在main.js注册
import httpApi from './js/httpApi.js';
import api from './js/api.js';
import request from './js/request.js'

 // 赋值到vue里面
Vue.prototype.$httpApi = httpApi
Vue.prototype.$api = api


5.vue页面请求使用
let params = {};
that.$request.getRequest(that.$api.loginInfo ,params,that.token).then(res=>{
			 // console.log("成功的:",res)
	 if (res.data.Dispatchlist.length == 0) {
	 		//代码省略
		}
	 }

Logo

欢迎加入 MCP 技术社区!与志同道合者携手前行,一同解锁 MCP 技术的无限可能!

更多推荐